<!doctype html><html lang="en">
 <head>
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
  <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
  <title>Subresource Integrity</title>
<style data-fill-with="stylesheet">/******************************************************************************
 *                   Style sheet for the W3C specifications                   *
 *
 * Special classes handled by this style sheet include:
 *
 * Indices
 *   - .toc for the Table of Contents (<ol class="toc">)
 *     + <span class="secno"> for the section numbers
 *   - #toc for the Table of Contents (<nav id="toc">)
 *   - ul.index for Indices (<a href="#ref">term</a><span>, in §N.M</span>)
 *   - table.index for Index Tables (e.g. for properties or elements)
 *
 * Structural Markup
 *   - table.data for general data tables
 *     -> use 'scope' attribute, <colgroup>, <thead>, and <tbody> for best results !
 *     -> use <table class='complex data'> for extra-complex tables
 *     -> use <td class='long'> for paragraph-length cell content
 *     -> use <td class='pre'> when manual line breaks/indentation would help readability
 *   - dl.switch for switch statements
 *   - ol.algorithm for algorithms (helps to visualize nesting)
 *   - .figure and .caption (HTML4) and figure and figcaption (HTML5)
 *     -> .sidefigure for right-floated figures
 *   - ins/del
 *
 * Code
 *   - pre and code
 *
 * Special Sections
 *   - .note       for informative notes             (div, p, span, aside, details)
 *   - .example    for informative examples          (div, p, pre, span)
 *   - .issue      for issues                        (div, p, span)
 *   - .assertion  for assertions                    (div, p, span)
 *   - .advisement for loud normative statements     (div, p, strong)
 *   - .annoying-warning for spec obsoletion notices (div, aside, details)
 *
 * Definition Boxes
 *   - pre.def   for WebIDL definitions
 *   - table.def for tables that define other entities (e.g. CSS properties)
 *   - dl.def    for definition lists that define other entitles (e.g. HTML elements)
 *
 * Numbering
 *   - .secno for section numbers in .toc and headings (<span class='secno'>3.2</span>)
 *   - .marker for source-inserted example/figure/issue numbers (<span class='marker'>Issue 4</span>)
 *   - ::before styled for CSS-generated issue/example/figure numbers:
 *     -> Documents wishing to use this only need to add
 *        figcaption::before,
 *        .caption::before { content: "Figure "  counter(figure) " ";  }
 *        .example::before { content: "Example " counter(example) " "; }
 *        .issue::before   { content: "Issue "   counter(issue) " ";   }
 *
 * Header Stuff (ignore, just don't conflict with these classes)
 *   - .head for the header
 *   - .copyright for the copyright
 *
 * Miscellaneous
 *   - .overlarge for things that should be as wide as possible, even if
 *     that overflows the body text area. This can be used on an item or
 *     on its container, depending on the effect desired.
 *     Note that this styling basically doesn't help at all when printing,
 *     since A4 paper isn't much wider than the max-width here.
 *     It's better to design things to fit into a narrower measure if possible.
 *   - js-added ToC jump links (see fixup.js)
 *
 ******************************************************************************/

/******************************************************************************/
/*                                   Body                                     */
/******************************************************************************/

	body {
		counter-reset: example figure issue;

		/* Layout */
		max-width: 50em;               /* limit line length to 50em for readability   */
		margin: 0 auto;                /* center text within page                     */
		padding: 1.6em 1.5em 2em 50px; /* assume 16px font size for downlevel clients */
		padding: 1.6em 1.5em 2em calc(26px + 1.5em); /* leave space for status flag     */

		/* Typography */
		line-height: 1.5;
		font-family: sans-serif;
		widows: 2;
		orphans: 2;
		word-wrap: break-word;
		overflow-wrap: break-word;
		hyphens: auto;

		/* Colors */
		color: black;
		background: white top left fixed no-repeat;
		background-size: 25px auto;
	}


/******************************************************************************/
/*                         Front Matter & Navigation                          */
/******************************************************************************/

/** Header ********************************************************************/

	div.head { margin-bottom: 1em }
	div.head hr { border-style: solid; }

	div.head h1 {
		font-weight: bold;
		margin: 0 0 .1em;
		font-size: 220%;
	}

	div.head h2 { margin-bottom: 1.5em;}

/** W3C Logo ******************************************************************/

	.head .logo {
		float: right;
		margin: 0.4rem 0 0.2rem .4rem;
	}

	.head img[src*="logos/W3C"] {
		display: block;
		border: solid #1a5e9a;
		border-width: .65rem .7rem .6rem;
		border-radius: .4rem;
		background: #1a5e9a;
		color: white;
		font-weight: bold;
	}

	.head a:hover > img[src*="logos/W3C"],
	.head a:focus > img[src*="logos/W3C"] {
		opacity: .8;
	}

	.head a:active > img[src*="logos/W3C"] {
		background: #c00;
		border-color: #c00;
	}

	/* see also additional rules in Link Styling section */

/** Copyright *****************************************************************/

	p.copyright,
	p.copyright small { font-size: small }

/** Back to Top / ToC Toggle **************************************************/

	@media print {
		#toc-nav {
			display: none;
		}
	}
	@media not print {
		#toc-nav {
			position: fixed;
			z-index: 2;
			bottom: 0; left: 0;
			margin: 0;
			min-width: 1.33em;
			border-top-right-radius: 2rem;
			box-shadow: 0 0 2px;
			font-size: 1.5em;
			color: black;
		}
		#toc-nav > a {
			display: block;
			white-space: nowrap;

			height: 1.33em;
			padding: .1em 0.3em;
			margin: 0;

			background: white;
			box-shadow: 0 0 2px;
			border: none;
			border-top-right-radius: 1.33em;
			background: white;
		}
		#toc-nav > #toc-jump {
			padding-bottom: 2em;
			margin-bottom: -1.9em;
		}

		#toc-nav > a:hover,
		#toc-nav > a:focus {
			background: #f8f8f8;
		}
		#toc-nav > a:not(:hover):not(:focus) {
			color: #707070;
		}

		/* statusbar gets in the way on keyboard focus; remove once browsers fix */
		#toc-nav > a[href="#toc"]:not(:hover):focus:last-child {
			padding-bottom: 1.5rem;
		}

		#toc-nav:not(:hover) > a:not(:focus) > span + span {
			/* Ideally this uses :focus-within on #toc-nav */
			display: none;
		}
		#toc-nav > a > span + span {
			padding-right: 0.2em;
		}

		#toc-toggle-inline {
			vertical-align: 0.05em;
			font-size: 80%;
			color: gray;
			color: hsla(203,20%,40%,.7);
			border-style: none;
			background: transparent;
			position: relative;
		}
		#toc-toggle-inline:hover:not(:active),
		#toc-toggle-inline:focus:not(:active) {
			text-shadow: 1px 1px silver;
			top: -1px;
			left: -1px;
		}

		#toc-nav :active {
			color: #C00;
		}
	}

/** ToC Sidebar ***************************************************************/

	/* Floating sidebar */
	@media screen {
		body.toc-sidebar #toc {
			position: fixed;
			top: 0; bottom: 0;
			left: 0;
			width: 23.5em;
			max-width: 80%;
			max-width: calc(100% - 2em - 26px);
			overflow: auto;
			padding: 0 1em;
			padding-left: 42px;
			padding-left: calc(1em + 26px);
			background: inherit;
			background-color: #f7f8f9;
			z-index: 1;
			box-shadow: -.1em 0 .25em rgba(0,0,0,.1) inset;
		}
		body.toc-sidebar #toc h2 {
			margin-top: .8rem;
			font-variant: small-caps;
			font-variant: all-small-caps;
			text-transform: lowercase;
			font-weight: bold;
			color: gray;
			color: hsla(203,20%,40%,.7);
		}
		body.toc-sidebar #toc-jump:not(:focus) {
			width: 0;
			height: 0;
			padding: 0;
			position: absolute;
			overflow: hidden;
		}
	}
	/* Hide main scroller when only the ToC is visible anyway */
	@media screen and (max-width: 28em) {
		body.toc-sidebar {
			overflow: hidden;
		}
	}

	/* Sidebar with its own space */
	@media screen and (min-width: 78em) {
		body:not(.toc-inline) #toc {
			position: fixed;
			top: 0; bottom: 0;
			left: 0;
			width: 23.5em;
			overflow: auto;
			padding: 0 1em;
			padding-left: 42px;
			padding-left: calc(1em + 26px);
			background: inherit;
			background-color: #f7f8f9;
			z-index: 1;
			box-shadow: -.1em 0 .25em rgba(0,0,0,.1) inset;
		}
		body:not(.toc-inline) #toc h2 {
			margin-top: .8rem;
			font-variant: small-caps;
			font-variant: all-small-caps;
			text-transform: lowercase;
			font-weight: bold;
			color: gray;
			color: hsla(203,20%,40%,.7);
		}

		body:not(.toc-inline) {
			padding-left: 29em;
		}
		/* See also Overflow section at the bottom */

		body:not(.toc-inline) #toc-jump:not(:focus) {
			width: 0;
			height: 0;
			padding: 0;
			position: absolute;
			overflow: hidden;
		}
	}
	@media screen and (min-width: 90em) {
		body:not(.toc-inline) {
			margin: 0 4em;
		}
	}

/******************************************************************************/
/*                                Sectioning                                  */
/******************************************************************************/

/** Headings ******************************************************************/

	h1, h2, h3, h4, h5, h6, dt {
		page-break-after: avoid;
		page-break-inside: avoid;
		font: 100% sans-serif;   /* Reset all font styling to clear out UA styles */
		font-family: inherit;    /* Inherit the font family. */
		line-height: 1.2;        /* Keep wrapped headings compact */
		hyphens: manual;         /* Hyphenated headings look weird */
	}

	h2, h3, h4, h5, h6 {
		margin-top: 3rem;
	}

	h1, h2, h3 {
		color: #005A9C;
		background: transparent;
	}

	h1 { font-size: 170%; }
	h2 { font-size: 140%; }
	h3 { font-size: 120%; }
	h4 { font-weight: bold; }
	h5 { font-style: italic; }
	h6 { font-variant: small-caps; }
	dt { font-weight: bold; }

/** Subheadings ***************************************************************/

	h1 + h2,
	#subtitle {
		/* #subtitle is a subtitle in an H2 under the H1 */
		margin-top: 0;
	}
	h2 + h3,
	h3 + h4,
	h4 + h5,
	h5 + h6 {
		margin-top: 1.2em; /* = 1 x line-height */
	}

/** Section divider ***********************************************************/

	:not(.head) > hr {
		font-size: 1.5em;
		text-align: center;
		margin: 1em auto;
		height: auto;
		border: transparent solid 0;
		background: transparent;
	}
	:not(.head) > hr::before {
		content: "\2727\2003\2003\2727\2003\2003\2727";
	}

/******************************************************************************/
/*                            Paragraphs and Lists                            */
/******************************************************************************/

	p {
		margin: 1em 0;
	}

	dd > p:first-child,
	li > p:first-child {
		margin-top: 0;
	}

	ul, ol {
		margin-left: 0;
		padding-left: 2em;
	}

	li {
		margin: 0.25em 0 0.5em;
		padding: 0;
	}

	dl dd {
		margin: 0 0 .5em 2em;
	}

	.head dd + dd { /* compact for header */
		margin-top: -.5em;
	}

	/* Style for algorithms */
	ol.algorithm ol:not(.algorithm),
	.algorithm > ol ol:not(.algorithm) {
	 border-left: 0.5em solid #DEF;
	}

	/* Put nice boxes around each algorithm. */
	[data-algorithm]:not(.heading) {
	  padding: .5em;
	  border: thin solid #ddd; border-radius: .5em;
	  margin: .5em calc(-0.5em - 1px);
	}
	[data-algorithm]:not(.heading) > :first-child {
	  margin-top: 0;
	}
	[data-algorithm]:not(.heading) > :last-child {
	  margin-bottom: 0;
	}

	/* Style for switch/case <dl>s */
	dl.switch > dd > ol.only,
	dl.switch > dd > .only > ol {
	 margin-left: 0;
	}
	dl.switch > dd > ol.algorithm,
	dl.switch > dd > .algorithm > ol {
	 margin-left: -2em;
	}
	dl.switch {
	 padding-left: 2em;
	}
	dl.switch > dt {
	 text-indent: -1.5em;
	 margin-top: 1em;
	}
	dl.switch > dt + dt {
	 margin-top: 0;
	}
	dl.switch > dt::before {
	 content: '\21AA';
	 padding: 0 0.5em 0 0;
	 display: inline-block;
	 width: 1em;
	 text-align: right;
	 line-height: 0.5em;
	}

/** Terminology Markup ********************************************************/


/******************************************************************************/
/*                                 Inline Markup                              */
/******************************************************************************/

/** Terminology Markup ********************************************************/
	dfn   { /* Defining instance */
		font-weight: bolder;
	}
	a > i { /* Instance of term */
		font-style: normal;
	}
	dt dfn code, code.idl {
		font-size: medium;
	}
	dfn var {
		font-style: normal;
	}

/** Change Marking ************************************************************/

	del { color: red;  text-decoration: line-through; }
	ins { color: #080; text-decoration: underline;    }

/** Miscellaneous improvements to inline formatting ***************************/

	sup {
		vertical-align: super;
		font-size: 80%
	}

/******************************************************************************/
/*                                    Code                                    */
/******************************************************************************/

/** General monospace/pre rules ***********************************************/

	pre, code, samp {
		font-family: Menlo, Consolas, "DejaVu Sans Mono", Monaco, monospace;
		font-size: .9em;
		page-break-inside: avoid;
		hyphens: none;
		text-transform: none;
	}
	pre code,
	code code {
		font-size: 100%;
	}

	pre {
		margin-top: 1em;
		margin-bottom: 1em;
		overflow: auto;
	}

/** Inline Code fragments *****************************************************/

  /* Do something nice. */

/******************************************************************************/
/*                                    Links                                   */
/******************************************************************************/

/** General Hyperlinks ********************************************************/

	/* We hyperlink a lot, so make it less intrusive */
	a[href] {
		color: #034575;
		text-decoration: none;
		border-bottom: 1px solid #707070;
		/* Need a bit of extending for it to look okay */
		padding: 0 1px 0;
		margin: 0 -1px 0;
	}
	a:visited {
		border-bottom-color: #BBB;
	}

	/* Use distinguishing colors when user is interacting with the link */
	a[href]:focus,
	a[href]:hover {
		background: #f8f8f8;
		background: rgba(75%, 75%, 75%, .25);
		border-bottom-width: 3px;
		margin-bottom: -2px;
	}
	a[href]:active {
		color: #C00;
		border-color: #C00;
	}

	/* Backout above styling for W3C logo */
	.head .logo,
	.head .logo a {
		border: none;
		text-decoration: none;
		background: transparent;
	}

/******************************************************************************/
/*                                    Images                                  */
/******************************************************************************/

	img {
		border-style: none;
	}

	/* For autogen numbers, add
	   .caption::before, figcaption::before { content: "Figure " counter(figure) ". "; }
	*/

	figure, .figure, .sidefigure {
		page-break-inside: avoid;
		text-align: center;
		margin: 2.5em 0;
	}
	.figure img,    .sidefigure img,    figure img,
	.figure object, .sidefigure object, figure object {
		max-width: 100%;
		margin: auto;
	}
	.figure pre, .sidefigure pre, figure pre {
		text-align: left;
		display: table;
		margin: 1em auto;
	}
	.figure table, figure table {
		margin: auto;
	}
	@media screen and (min-width: 20em) {
		.sidefigure {
			float: right;
			width: 50%;
			margin: 0 0 0.5em 0.5em
		}
	}
	.caption, figcaption, caption {
		font-style: italic;
		font-size: 90%;
	}
	.caption::before, figcaption::before, figcaption > .marker {
		font-weight: bold;
	}
	.caption, figcaption {
		counter-increment: figure;
	}

	/* DL list is indented 2em, but figure inside it is not */
	dd > .figure, dd > figure { margin-left: -2em }

/******************************************************************************/
/*                             Colored Boxes                                  */
/******************************************************************************/

	.issue, .note, .example, .assertion, .advisement, blockquote {
		padding: .5em;
		border: .5em;
		border-left-style: solid;
		page-break-inside: avoid;
	}
	span.issue, span.note {
		padding: .1em .5em .15em;
		border-right-style: solid;
	}

	.issue,
	.note,
	.example,
	.advisement,
	.assertion,
	blockquote {
		margin: 1em auto;
	}
	.note  > p:first-child,
	.issue > p:first-child,
	blockquote > :first-child {
		margin-top: 0;
	}
	blockquote > :last-child {
		margin-bottom: 0;
	}

/** Blockquotes ***************************************************************/

	blockquote {
		border-color: silver;
	}

/** Open issue ****************************************************************/

	.issue {
		border-color: #E05252;
		background: #FBE9E9;
		counter-increment: issue;
		overflow: auto;
	}
	.issue::before, .issue > .marker {
		text-transform: uppercase;
		color: #AE1E1E;
		padding-right: 1em;
		text-transform: uppercase;
	}
	/* Add .issue::before { content: "Issue " counter(issue) " "; } for autogen numbers,
	   or use class="marker" to mark up the issue number in source. */

/** Example *******************************************************************/

	.example {
		border-color: #E0CB52;
		background: #FCFAEE;
		counter-increment: example;
		overflow: auto;
		clear: both;
	}
	.example::before, .example > .marker {
		text-transform: uppercase;
		color: #827017;
		min-width: 7.5em;
		display: block;
	}
	/* Add .example::before { content: "Example " counter(example) " "; } for autogen numbers,
	   or use class="marker" to mark up the example number in source. */

/** Non-normative Note ********************************************************/

	.note {
		border-color: #52E052;
		background: #E9FBE9;
		overflow: auto;
	}

	.note::before, .note > .marker,
	details.note > summary::before,
	details.note > summary > .marker {
		text-transform: uppercase;
		display: block;
		color: hsl(120, 70%, 30%);
	}
	/* Add .note::before { content: "Note"; } for autogen label,
	   or use class="marker" to mark up the label in source. */

	details.note > summary {
		display: block;
		color: hsl(120, 70%, 30%);
	}
	details.note[open] > summary {
		border-bottom: 1px silver solid;
	}

/** Assertion Box *************************************************************/
	/*  for assertions in algorithms */

	.assertion {
		border-color: #AAA;
		background: #EEE;
	}

/** Advisement Box ************************************************************/
	/*  for attention-grabbing normative statements */

	.advisement {
		border-color: orange;
		border-style: none solid;
		background: #FFEECC;
	}
	strong.advisement {
		display: block;
		text-align: center;
	}
	.advisement > .marker {
		color: #B35F00;
	}

/** Spec Obsoletion Notice ****************************************************/
	/* obnoxious obsoletion notice for older/abandoned specs. */

	details {
		display: block;
	}
	summary {
		font-weight: bolder;
	}

	.annoying-warning:not(details),
	details.annoying-warning:not([open]) > summary,
	details.annoying-warning[open] {
		background: #fdd;
		color: red;
		font-weight: bold;
		padding: .75em 1em;
		border: thick red;
		border-style: solid;
		border-radius: 1em;
	}
	.annoying-warning :last-child {
		margin-bottom: 0;
	}

@media not print {
	details.annoying-warning[open] {
		position: fixed;
		left: 1em;
		right: 1em;
		bottom: 1em;
		z-index: 1000;
	}
}

	details.annoying-warning:not([open]) > summary {
		text-align: center;
	}

/** Entity Definition Boxes ***************************************************/

	.def {
		padding: .5em 1em;
		background: #DEF;
		margin: 1.2em 0;
		border-left: 0.5em solid #8CCBF2;
	}

/******************************************************************************/
/*                                    Tables                                  */
/******************************************************************************/

	th, td {
		text-align: left;
		text-align: start;
	}

/** Property/Descriptor Definition Tables *************************************/

	table.def {
		/* inherits .def box styling, see above */
		width: 100%;
		border-spacing: 0;
	}

	table.def td,
	table.def th {
		padding: 0.5em;
		vertical-align: baseline;
		border-bottom: 1px solid #bbd7e9;
	}

	table.def > tbody > tr:last-child th,
	table.def > tbody > tr:last-child td {
		border-bottom: 0;
	}

	table.def th {
		font-style: italic;
		font-weight: normal;
		padding-left: 1em;
		width: 3em;
	}

	/* For when values are extra-complex and need formatting for readability */
	table td.pre {
		white-space: pre-wrap;
	}

	/* A footnote at the bottom of a def table */
	table.def           td.footnote {
		padding-top: 0.6em;
	}
	table.def           td.footnote::before {
		content: " ";
		display: block;
		height: 0.6em;
		width: 4em;
		border-top: thin solid;
	}

/** Data tables (and properly marked-up index tables) *************************/
	/*
		 <table class="data"> highlights structural relationships in a table
		 when correct markup is used (e.g. thead/tbody, th vs. td, scope attribute)

		 Use class="complex data" for particularly complicated tables --
		 (This will draw more lines: busier, but clearer.)

		 Use class="long" on table cells with paragraph-like contents
		 (This will adjust text alignment accordingly.)
		 Alternately use class="longlastcol" on tables, to have the last column assume "long".
	*/

	table {
		word-wrap: normal;
		overflow-wrap: normal;
		hyphens: manual;
	}

	table.data,
	table.index {
		margin: 1em auto;
		border-collapse: collapse;
		border: hidden;
		width: 100%;
	}
	table.data caption,
	table.index caption {
		max-width: 50em;
		margin: 0 auto 1em;
	}

	table.data td,  table.data th,
	table.index td, table.index th {
		padding: 0.5em 1em;
		border-width: 1px;
		border-color: silver;
		border-top-style: solid;
	}

	table.data thead td:empty {
		padding: 0;
		border: 0;
	}

	table.data  thead,
	table.index thead,
	table.data  tbody,
	table.index tbody {
		border-bottom: 2px solid;
	}

	table.data colgroup,
	table.index colgroup {
		border-left: 2px solid;
	}

	table.data  tbody th:first-child,
	table.index tbody th:first-child  {
		border-right: 2px solid;
		border-top: 1px solid silver;
		padding-right: 1em;
	}

	table.data th[colspan],
	table.data td[colspan] {
		text-align: center;
	}

	table.complex.data th,
	table.complex.data td {
		border: 1px solid silver;
		text-align: center;
	}

	table.data.longlastcol td:last-child,
	table.data td.long {
	 vertical-align: baseline;
	 text-align: left;
	}

	table.data img {
		vertical-align: middle;
	}


/*
Alternate table alignment rules

	table.data,
	table.index {
		text-align: center;
	}

	table.data  thead th[scope="row"],
	table.index thead th[scope="row"] {
		text-align: right;
	}

	table.data  tbody th:first-child,
	table.index tbody th:first-child  {
		text-align: right;
	}

Possible extra rowspan handling

	table.data  tbody th[rowspan]:not([rowspan='1']),
	table.index tbody th[rowspan]:not([rowspan='1']),
	table.data  tbody td[rowspan]:not([rowspan='1']),
	table.index tbody td[rowspan]:not([rowspan='1']) {
		border-left: 1px solid silver;
	}

	table.data  tbody th[rowspan]:first-child,
	table.index tbody th[rowspan]:first-child,
	table.data  tbody td[rowspan]:first-child,
	table.index tbody td[rowspan]:first-child{
		border-left: 0;
		border-right: 1px solid silver;
	}
*/

/******************************************************************************/
/*                                  Indices                                   */
/******************************************************************************/


/** Table of Contents *********************************************************/

	.toc a {
		/* More spacing; use padding to make it part of the click target. */
		padding-top: 0.1rem;
		/* Larger, more consistently-sized click target */
		display: block;
		/* Reverse color scheme */
		color: black;
		border-color: #3980B5;
		border-bottom-width: 3px !important;
		margin-bottom: 0px !important;
	}
	.toc a:visited {
		border-color: #054572;
	}
	.toc a:not(:focus):not(:hover) {
		/* Allow colors to cascade through from link styling */
		border-bottom-color: transparent;
	}

	.toc, .toc ol, .toc ul, .toc li {
		list-style: none; /* Numbers must be inlined into source */
		/* because generated content isn't search/selectable and markers can't do multilevel yet */
		margin:  0;
		padding: 0;
		line-height: 1.1rem; /* consistent spacing */
	}

	/* ToC not indented until third level, but font style & margins show hierarchy */
	.toc > li             { font-weight: bold;   }
	.toc > li li          { font-weight: normal; }
	.toc > li li li       { font-size:   95%;    }
	.toc > li li li li    { font-size:   90%;    }
	.toc > li li li li .secno { font-size: 85%; }
	.toc > li li li li li { font-size:   85%;    }
	.toc > li li li li li .secno { font-size: 100%; }

	/* @supports not (display:grid) { */
		.toc > li             { margin: 1.5rem 0;    }
		.toc > li li          { margin: 0.3rem 0;    }
		.toc > li li li       { margin-left: 2rem;   }

		/* Section numbers in a column of their own */
		.toc .secno {
			float: left;
			width: 4rem;
			white-space: nowrap;
		}

		.toc li {
			clear: both;
		}

		:not(li) > .toc              { margin-left:  5rem; }
		.toc .secno                  { margin-left: -5rem; }
		.toc > li li li .secno       { margin-left: -7rem; }
		.toc > li li li li .secno    { margin-left: -9rem; }
		.toc > li li li li li .secno { margin-left: -11rem; }

		/* Tighten up indentation in narrow ToCs */
		@media (max-width: 30em) {
			:not(li) > .toc              { margin-left:  4rem; }
			.toc .secno                  { margin-left: -4rem; }
			.toc > li li li              { margin-left:  1rem; }
			.toc > li li li .secno       { margin-left: -5rem; }
			.toc > li li li li .secno    { margin-left: -6rem; }
			.toc > li li li li li .secno { margin-left: -7rem; }
		}
	/* } */

	@supports (display:grid) and (display:contents) {
		/* Use #toc over .toc to override non-@supports rules. */
		#toc {
			display: grid;
			align-content: start;
			grid-template-columns: auto 1fr;
			grid-column-gap: 1rem;
			column-gap: 1rem;
			grid-row-gap: .6rem;
			row-gap: .6rem;
		}
		#toc h2 {
			grid-column: 1 / -1;
			margin-bottom: 0;
		}
		#toc ol,
		#toc li,
		#toc a {
			display: contents;
			/* Switch <a> to subgrid when supported */
		}
		#toc span {
			margin: 0;
		}
		#toc > .toc > li > a > span {
			/* The spans of the top-level list,
			   comprising the first items of each top-level section. */
			margin-top: 1.1rem;
		}
		#toc#toc .secno { /* Ugh, need more specificity to override base.css */
			grid-column: 1;
			width: auto;
			margin-left: 0;
		}
		#toc .content {
			grid-column: 2;
			width: auto;
			margin-right: 1rem;
		}
		#toc .content:hover {
			background: rgba(75%, 75%, 75%, .25);
			border-bottom: 3px solid #054572;
			margin-bottom: -3px;
		}
		#toc li li li .content {
			margin-left: 1rem;
		}
		#toc li li li li .content {
			margin-left: 2rem;
		}
	}


/** Index *********************************************************************/

	/* Index Lists: Layout */
	ul.index       { margin-left: 0; columns: 15em; text-indent: 1em hanging; }
	ul.index li    { margin-left: 0; list-style: none; break-inside: avoid; }
	ul.index li li { margin-left: 1em }
	ul.index dl    { margin-top: 0; }
	ul.index dt    { margin: .2em 0 .2em 20px;}
	ul.index dd    { margin: .2em 0 .2em 40px;}
	/* Index Lists: Typography */
	ul.index ul,
	ul.index dl { font-size: smaller; }
	@media not print {
		ul.index li span {
			white-space: nowrap;
			color: transparent; }
		ul.index li a:hover + span,
		ul.index li a:focus + span {
			color: #707070;
		}
	}

/** Index Tables *****************************************************/
	/* See also the data table styling section, which this effectively subclasses */

	table.index {
		font-size: small;
		border-collapse: collapse;
		border-spacing: 0;
		text-align: left;
		margin: 1em 0;
	}

	table.index td,
	table.index th {
		padding: 0.4em;
	}

	table.index tr:hover td:not([rowspan]),
	table.index tr:hover th:not([rowspan]) {
		background: #f7f8f9;
	}

	/* The link in the first column in the property table (formerly a TD) */
	table.index th:first-child a {
		font-weight: bold;
	}

/******************************************************************************/
/*                                    Print                                   */
/******************************************************************************/

	@media print {
		/* Pages have their own margins. */
		html {
			margin: 0;
		}
		/* Serif for print. */
		body {
			font-family: serif;
		}
	}
	@page {
		margin: 1.5cm 1.1cm;
	}

/******************************************************************************/
/*                                    Legacy                                  */
/******************************************************************************/

	/* This rule is inherited from past style sheets. No idea what it's for. */
	.hide { display: none }



/******************************************************************************/
/*                             Overflow Control                               */
/******************************************************************************/

	.figure .caption, .sidefigure .caption, figcaption {
		/* in case figure is overlarge, limit caption to 50em */
		max-width: 50rem;
		margin-left: auto;
		margin-right: auto;
	}
	.overlarge {
		/* Magic to create good table positioning:
		   "content column" is 50ems wide at max; less on smaller screens.
		   Extra space (after ToC + content) is empty on the right.

		   1. When table < content column, centers table in column.
		   2. When content < table < available, left-aligns.
		   3. When table > available, fills available + scroll bar.
		*/ 
		display: grid;
		grid-template-columns: minmax(0, 50em);
	}
	.overlarge > table {
		/* limit preferred width of table */
		max-width: 50em;
		margin-left: auto;
		margin-right: auto;
	}

	@media (min-width: 55em) {
		.overlarge {
			margin-right: calc(13px + 26.5rem - 50vw);
			max-width: none;
		}
	}
	@media screen and (min-width: 78em) {
		body:not(.toc-inline) .overlarge {
			/* 30.5em body padding 50em content area */
			margin-right: calc(40em - 50vw) !important;
		}
	}
	@media screen and (min-width: 90em) {
		body:not(.toc-inline) .overlarge {
			/* 4em html margin 30.5em body padding 50em content area */
			margin-right: calc(84.5em - 100vw) !important;
		}
	}

	@media not print {
		.overlarge {
			overflow-x: auto;
			/* See Lea Verou's explanation background-attachment:
			 * http://lea.verou.me/2012/04/background-attachment-local/
			 *
			background: top left  / 4em 100% linear-gradient(to right,  #ffffff, rgba(255, 255, 255, 0)) local,
			            top right / 4em 100% linear-gradient(to left, #ffffff, rgba(255, 255, 255, 0)) local,
			            top left  / 1em 100% linear-gradient(to right,  #c3c3c5, rgba(195, 195, 197, 0)) scroll,
			            top right / 1em 100% linear-gradient(to left, #c3c3c5, rgba(195, 195, 197, 0)) scroll,
			            white;
			background-repeat: no-repeat;
			*/
		}
	}
</style>
  <link href="http://www.w3.org/TR/SRI/" rel="canonical">
<style>/* style-md-lists */

/* This is a weird hack for me not yet following the commonmark spec
   regarding paragraph and lists. */
[data-md] > :first-child {
    margin-top: 0;
}
[data-md] > :last-child {
    margin-bottom: 0;
}</style>
<style>/* style-selflinks */

.heading, .issue, .note, .example, li, dt {
    position: relative;
}
a.self-link {
    position: absolute;
    top: 0;
    left: calc(-1 * (3.5rem - 26px));
    width: calc(3.5rem - 26px);
    height: 2em;
    text-align: center;
    border: none;
    transition: opacity .2s;
    opacity: .5;
}
a.self-link:hover {
    opacity: 1;
}
.heading > a.self-link {
    font-size: 83%;
}
li > a.self-link {
    left: calc(-1 * (3.5rem - 26px) - 2em);
}
dfn > a.self-link {
    top: auto;
    left: auto;
    opacity: 0;
    width: 1.5em;
    height: 1.5em;
    background: gray;
    color: white;
    font-style: normal;
    transition: opacity .2s, background-color .2s, color .2s;
}
dfn:hover > a.self-link {
    opacity: 1;
}
dfn > a.self-link:hover {
    color: black;
}

a.self-link::before            { content: "¶"; }
.heading > a.self-link::before { content: "§"; }
dfn > a.self-link::before      { content: "#"; }</style>
<style>/* style-counters */

body {
    counter-reset: example figure issue;
}
.issue {
    counter-increment: issue;
}
.issue:not(.no-marker)::before {
    content: "Issue " counter(issue);
}

.example {
    counter-increment: example;
}
.example:not(.no-marker)::before {
    content: "Example " counter(example);
}
.invalid.example:not(.no-marker)::before,
.illegal.example:not(.no-marker)::before {
    content: "Invalid Example" counter(example);
}

figcaption {
    counter-increment: figure;
}
figcaption:not(.no-marker)::before {
    content: "Figure " counter(figure) " ";
}</style>
<style>/* style-autolinks */

.css.css, .property.property, .descriptor.descriptor {
    color: #005a9c;
    font-size: inherit;
    font-family: inherit;
}
.css::before, .property::before, .descriptor::before {
    content: "‘";
}
.css::after, .property::after, .descriptor::after {
    content: "’";
}
.property, .descriptor {
    /* Don't wrap property and descriptor names */
    white-space: nowrap;
}
.type { /* CSS value <type> */
    font-style: italic;
}
pre .property::before, pre .property::after {
    content: "";
}
[data-link-type="property"]::before,
[data-link-type="propdesc"]::before,
[data-link-type="descriptor"]::before,
[data-link-type="value"]::before,
[data-link-type="function"]::before,
[data-link-type="at-rule"]::before,
[data-link-type="selector"]::before,
[data-link-type="maybe"]::before {
    content: "‘";
}
[data-link-type="property"]::after,
[data-link-type="propdesc"]::after,
[data-link-type="descriptor"]::after,
[data-link-type="value"]::after,
[data-link-type="function"]::after,
[data-link-type="at-rule"]::after,
[data-link-type="selector"]::after,
[data-link-type="maybe"]::after {
    content: "’";
}

[data-link-type].production::before,
[data-link-type].production::after,
.prod [data-link-type]::before,
.prod [data-link-type]::after {
    content: "";
}

[data-link-type=element],
[data-link-type=element-attr] {
    font-family: Menlo, Consolas, "DejaVu Sans Mono", monospace;
    font-size: .9em;
}
[data-link-type=element]::before { content: "<" }
[data-link-type=element]::after  { content: ">" }

[data-link-type=biblio] {
    white-space: pre;
}</style>
<style>/* style-dfn-panel */

.dfn-panel {
    position: absolute;
    z-index: 35;
    height: auto;
    width: -webkit-fit-content;
    width: fit-content;
    max-width: 300px;
    max-height: 500px;
    overflow: auto;
    padding: 0.5em 0.75em;
    font: small Helvetica Neue, sans-serif, Droid Sans Fallback;
    background: #DDDDDD;
    color: black;
    border: outset 0.2em;
}
.dfn-panel:not(.on) { display: none; }
.dfn-panel * { margin: 0; padding: 0; text-indent: 0; }
.dfn-panel > b { display: block; }
.dfn-panel a { color: black; }
.dfn-panel a:not(:hover) { text-decoration: none !important; border-bottom: none !important; }
.dfn-panel > b + b { margin-top: 0.25em; }
.dfn-panel ul { padding: 0; }
.dfn-panel li { list-style: inside; }
.dfn-panel.activated {
    display: inline-block;
    position: fixed;
    left: .5em;
    bottom: 2em;
    margin: 0 auto;
    max-width: calc(100vw - 1.5em - .4em - .5em);
    max-height: 30vh;
}

.dfn-paneled { cursor: pointer; }
</style>
<style>/* style-syntax-highlighting */
pre.idl.highlight { color: #708090; }
.highlight:not(.idl) { background: hsl(24, 20%, 95%); }
code.highlight { padding: .1em; border-radius: .3em; }
pre.highlight, pre > code.highlight { display: block; padding: 1em; margin: .5em 0; overflow: auto; border-radius: 0; }
c-[a] { color: #990055 } /* Keyword.Declaration */
c-[b] { color: #990055 } /* Keyword.Type */
c-[c] { color: #708090 } /* Comment */
c-[d] { color: #708090 } /* Comment.Multiline */
c-[e] { color: #0077aa } /* Name.Attribute */
c-[f] { color: #669900 } /* Name.Tag */
c-[g] { color: #222222 } /* Name.Variable */
c-[k] { color: #990055 } /* Keyword */
c-[l] { color: #000000 } /* Literal */
c-[m] { color: #000000 } /* Literal.Number */
c-[n] { color: #0077aa } /* Name */
c-[o] { color: #999999 } /* Operator */
c-[p] { color: #999999 } /* Punctuation */
c-[s] { color: #a67f59 } /* Literal.String */
c-[t] { color: #a67f59 } /* Literal.String.Single */
c-[u] { color: #a67f59 } /* Literal.String.Double */
c-[cp] { color: #708090 } /* Comment.Preproc */
c-[c1] { color: #708090 } /* Comment.Single */
c-[cs] { color: #708090 } /* Comment.Special */
c-[kc] { color: #990055 } /* Keyword.Constant */
c-[kn] { color: #990055 } /* Keyword.Namespace */
c-[kp] { color: #990055 } /* Keyword.Pseudo */
c-[kr] { color: #990055 } /* Keyword.Reserved */
c-[ld] { color: #000000 } /* Literal.Date */
c-[nc] { color: #0077aa } /* Name.Class */
c-[no] { color: #0077aa } /* Name.Constant */
c-[nd] { color: #0077aa } /* Name.Decorator */
c-[ni] { color: #0077aa } /* Name.Entity */
c-[ne] { color: #0077aa } /* Name.Exception */
c-[nf] { color: #0077aa } /* Name.Function */
c-[nl] { color: #0077aa } /* Name.Label */
c-[nn] { color: #0077aa } /* Name.Namespace */
c-[py] { color: #0077aa } /* Name.Property */
c-[ow] { color: #999999 } /* Operator.Word */
c-[mb] { color: #000000 } /* Literal.Number.Bin */
c-[mf] { color: #000000 } /* Literal.Number.Float */
c-[mh] { color: #000000 } /* Literal.Number.Hex */
c-[mi] { color: #000000 } /* Literal.Number.Integer */
c-[mo] { color: #000000 } /* Literal.Number.Oct */
c-[sb] { color: #a67f59 } /* Literal.String.Backtick */
c-[sc] { color: #a67f59 } /* Literal.String.Char */
c-[sd] { color: #a67f59 } /* Literal.String.Doc */
c-[se] { color: #a67f59 } /* Literal.String.Escape */
c-[sh] { color: #a67f59 } /* Literal.String.Heredoc */
c-[si] { color: #a67f59 } /* Literal.String.Interpol */
c-[sx] { color: #a67f59 } /* Literal.String.Other */
c-[sr] { color: #a67f59 } /* Literal.String.Regex */
c-[ss] { color: #a67f59 } /* Literal.String.Symbol */
c-[vc] { color: #0077aa } /* Name.Variable.Class */
c-[vg] { color: #0077aa } /* Name.Variable.Global */
c-[vi] { color: #0077aa } /* Name.Variable.Instance */
c-[il] { color: #000000 } /* Literal.Number.Integer.Long */
</style>
 <body class="h-entry">
  <div class="head">
   <p data-fill-with="logo"><a class="logo" href="https://www.w3.org/"> <img alt="W3C" height="48" src="https://www.w3.org/StyleSheets/TR/2016/logos/W3C" width="72"> </a> </p>
   <h1 class="p-name no-ref" id="title">Subresource Integrity</h1>
   <h2 class="no-num no-toc no-ref heading settled" id="subtitle"><span class="content">Editor’s Draft, <time class="dt-updated" datetime="1970-01-01">1 January 1970</time></span></h2>
   <div data-fill-with="spec-metadata">
    <dl>
     <dt>This version:
     <dd><a class="u-url" href="https://w3c.github.io/webappsec-subresource-integrity/">https://w3c.github.io/webappsec-subresource-integrity/</a>
     <dt>Latest published version:
     <dd><a href="http://www.w3.org/TR/SRI/">http://www.w3.org/TR/SRI/</a>
     <dt>Previous Versions:
     <dd><a href="http://www.w3.org/TR/2015/WD-SRI-20151006/" rel="prev">http://www.w3.org/TR/2015/WD-SRI-20151006/</a>
     <dt>Version History:
     <dd><a href="https://github.com/w3c/webappsec-subresource-integrity/commits/gh-pages">https://github.com/w3c/webappsec-subresource-integrity/commits/gh-pages</a>
     <dt>Feedback:
     <dd><span><a href="mailto:public-webappsec@w3.org?subject=%5BSRI%5D%20YOUR%20TOPIC%20HERE">public-webappsec@w3.org</a> with subject line “<kbd>[SRI] <i data-lt>… message topic …</i></kbd>” (<a href="https://lists.w3.org/Archives/Public/public-webappsec/" rel="discussion">archives</a>)</span>
     <dt class="editor">Editors:
     <dd class="editor p-author h-card vcard"><a class="p-name fn u-url url" href="http://devd.me">Devdatta Akhawe</a> (<span class="p-org org">Dropbox Inc.</span>) <a class="u-email email" href="mailto:dev.akhawe@gmail.com">dev.akhawe@gmail.com</a>
     <dd class="editor p-author h-card vcard" data-editor-id="68466"><a class="p-name fn u-url url" href="https://frederik-braun.com">Frederik Braun</a> (<span class="p-org org">Mozilla</span>) <a class="u-email email" href="mailto:fbraun@mozilla.com">fbraun@mozilla.com</a>
     <dd class="editor p-author h-card vcard"><a class="p-name fn u-url url" href="https://fmarier.org">François Marier</a> (<span class="p-org org">Mozilla</span>) <a class="u-email email" href="mailto:francois@mozilla.com">francois@mozilla.com</a>
     <dd class="editor p-author h-card vcard"><a class="p-name fn u-url url" href="https://joelweinberger.us">Joel Weinberger</a> (<span class="p-org org">Google Inc.</span>) <a class="u-email email" href="mailto:jww@google.com">jww@google.com</a>
     <dt>Implementation status:
     <dd><a href="https://code.google.com/p/chromium/issues/detail?id=355467">Blink/Chromium</a><br><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=992096">Gecko</a>
     <dt>Implementation report:
     <dd><a href="https://github.com/w3c/webappsec-subresource-integrity/wiki/Links">https://github.com/w3c/webappsec-subresource-integrity/wiki/Links</a>
     <dd>
    </dl>
   </div>
   <div data-fill-with="warning"></div>
   <p class="copyright" data-fill-with="copyright"><a href="https://www.w3.org/Consortium/Legal/ipr-notice#Copyright">Copyright</a> © 1970 <a href="https://www.w3.org/"><abbr title="World Wide Web Consortium">W3C</abbr></a><sup>®</sup> (<a href="https://www.csail.mit.edu/"><abbr title="Massachusetts Institute of Technology">MIT</abbr></a>, <a href="https://www.ercim.eu/"><abbr title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></a>, <a href="https://www.keio.ac.jp/">Keio</a>, <a href="https://ev.buaa.edu.cn/">Beihang</a>). W3C <a href="https://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>, <a href="https://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a> and <a href="https://www.w3.org/Consortium/Legal/copyright-documents">document use</a> rules apply. </p>
   <hr title="Separator for header">
  </div>
  <div class="p-summary" data-fill-with="abstract">
   <h2 class="no-num no-toc no-ref heading settled" id="abstract"><span class="content">Abstract</span></h2>
   <p>This specification defines a mechanism by which user agents may verify that a

  fetched resource has been delivered without unexpected manipulation.</p>
  </div>
  <h2 class="no-num no-toc no-ref heading settled" id="status"><span class="content">Status of this document</span></h2>
  <div data-fill-with="status">
   <p> This is a public copy of the editors’ draft.
	It is provided for discussion only and may change at any moment.
	Its publication here does not imply endorsement of its contents by W3C.
	Don’t cite this document other than as work in progress. </p>
   <p> <strong>Changes to this document may be tracked at <a href="https://github.com/w3c/webappsec">https://github.com/w3c/webappsec</a>.</strong> </p>
   <p> The (<a href="https://lists.w3.org/Archives/Public/public-webappsec/">archived</a>) public mailing list <a href="mailto:public-webappsec@w3.org?Subject=%5BSRI%5D%20PUT%20SUBJECT%20HERE">public-webappsec@w3.org</a> (see <a href="https://www.w3.org/Mail/Request">instructions</a>)
	is preferred for discussion of this specification.
	When sending e-mail,
	please put the text “SRI” in the subject,
	preferably like this:
	“[SRI] <em>…summary of comment…</em>” </p>
   <p> This document was produced by the <a href="https://www.w3.org/2011/webappsec/">Web Application Security Working Group</a>. </p>
   <p> This document was produced by a group operating under
	the <a href="https://www.w3.org/Consortium/Patent-Policy/">W3C Patent Policy</a>.
	W3C maintains a <a href="https://www.w3.org/2004/01/pp-impl/49309/status" rel="disclosure">public list of any patent disclosures</a> made in connection with the deliverables of the group;
	that page also includes instructions for disclosing a patent.
	An individual who has actual knowledge of a patent which the individual believes contains <a href="https://www.w3.org/Consortium/Patent-Policy/#def-essential">Essential Claim(s)</a> must disclose the information in accordance with <a href="https://www.w3.org/Consortium/Patent-Policy/#sec-Disclosure">section 6 of the W3C Patent Policy</a>. </p>
   <p> This document is governed by the <a href="https://www.w3.org/2019/Process-20190301/" id="w3c_process_revision">1 March 2019 W3C Process Document</a>. </p>
   <p></p>
  </div>
  <div data-fill-with="at-risk"></div>
  <nav data-fill-with="table-of-contents" id="toc">
   <h2 class="no-num no-toc no-ref" id="contents">Table of Contents</h2>
   <ol class="toc" role="directory">
    <li>
     <a href="#intro"><span class="secno">1</span> <span class="content">Introduction</span></a>
     <ol class="toc">
      <li><a href="#goals"><span class="secno">1.1</span> <span class="content">Goals</span></a>
      <li>
       <a href="#examples"><span class="secno">1.2</span> <span class="content">Use Cases/Examples</span></a>
       <ol class="toc">
        <li><a href="#resource-integrity"><span class="secno">1.2.1</span> <span class="content">Resource Integrity</span></a>
       </ol>
     </ol>
    <li>
     <a href="#terms"><span class="secno">2</span> <span class="content">Key Concepts and Terminology</span></a>
     <ol class="toc">
      <li><a href="#grammar-concepts"><span class="secno">2.1</span> <span class="content">Grammatical Concepts</span></a>
     </ol>
    <li>
     <a href="#framework"><span class="secno">3</span> <span class="content">Framework</span></a>
     <ol class="toc">
      <li><a href="#integrity-metadata-description"><span class="secno">3.1</span> <span class="content">Integrity metadata</span></a>
      <li>
       <a href="#hash-functions"><span class="secno">3.2</span> <span class="content">Cryptographic hash functions</span></a>
       <ol class="toc">
        <li><a href="#agility"><span class="secno">3.2.1</span> <span class="content">Agility</span></a>
        <li><a href="#priority"><span class="secno">3.2.2</span> <span class="content">Priority</span></a>
       </ol>
      <li>
       <a href="#verification-algorithms"><span class="secno">3.3</span> <span class="content">Response verification algorithms</span></a>
       <ol class="toc">
        <li><a href="#apply-algorithm-to-response"><span class="secno">3.3.1</span> <span class="content">Apply <var>algorithm</var> to <var>response</var></span></a>
        <li><a href="#is-response-eligible"><span class="secno">3.3.2</span> <span class="content">Is <var>response</var> eligible for integrity validation?</span></a>
        <li><a href="#parse-metadata"><span class="secno">3.3.3</span> <span class="content">Parse <var>metadata</var></span></a>
        <li><a href="#get-the-strongest-metadata"><span class="secno">3.3.4</span> <span class="content">Get the strongest metadata from <var>set</var></span></a>
        <li><a href="#does-response-match-metadatalist"><span class="secno">3.3.5</span> <span class="content">Does <var>response</var> match <var>metadataList</var>?</span></a>
       </ol>
      <li><a href="#verification-of-html-document-subresources"><span class="secno">3.4</span> <span class="content">Verification of HTML document subresources</span></a>
      <li><a href="#the-integrity-attribute"><span class="secno">3.5</span> <span class="content">The <code>integrity</code> attribute</span></a>
      <li>
       <a href="#interface-extensions"><span class="secno">3.6</span> <span class="content">Element interface extensions</span></a>
       <ol class="toc">
        <li>
         <a href="#HTMLLinkElement"><span class="secno">3.6.1</span> <span class="content">HTMLLinkElement</span></a>
         <ol class="toc">
          <li><a href="#HTMLLinkElement-Attributes"><span class="secno">3.6.1.1</span> <span class="content">Attributes</span></a>
         </ol>
        <li>
         <a href="#HTMLScriptElement"><span class="secno">3.6.2</span> <span class="content">HTMLScriptElement</span></a>
         <ol class="toc">
          <li><a href="#HTMLScriptElement-Attributes"><span class="secno">3.6.2.1</span> <span class="content">Attributes</span></a>
         </ol>
       </ol>
      <li><a href="#handling-integrity-violations"><span class="secno">3.7</span> <span class="content">Handling integrity violations</span></a>
      <li>
       <a href="#elements"><span class="secno">3.8</span> <span class="content">Elements</span></a>
       <ol class="toc">
        <li><a href="#link-element-for-stylesheets"><span class="secno">3.8.1</span> <span class="content">The <code>link</code> element for stylesheets</span></a>
        <li><a href="#script-element"><span class="secno">3.8.2</span> <span class="content">The <code>script</code> element</span></a>
       </ol>
     </ol>
    <li><a href="#proxies"><span class="secno">4</span> <span class="content">Proxies</span></a>
    <li>
     <a href="#security-considerations"><span class="secno">5</span> <span class="content">Security and Privacy Considerations</span></a>
     <ol class="toc">
      <li><a href="#non-secure-contexts"><span class="secno">5.1</span> <span class="content">Non-secure contexts remain non-secure</span></a>
      <li><a href="#hash-collision-attacks"><span class="secno">5.2</span> <span class="content">Hash collision attacks</span></a>
      <li><a href="#cross-origin-data-leakage"><span class="secno">5.3</span> <span class="content">Cross-origin data leakage</span></a>
     </ol>
    <li><a href="#acknowledgements"><span class="secno">6</span> <span class="content">Acknowledgements</span></a>
    <li>
     <a href="#conformance"><span class="secno"></span> <span class="content">Conformance</span></a>
     <ol class="toc">
      <li><a href="#conventions"><span class="secno"></span> <span class="content">Document conventions</span></a>
      <li><a href="#conformant-algorithms"><span class="secno"></span> <span class="content">Conformant Algorithms</span></a>
     </ol>
    <li>
     <a href="#index"><span class="secno"></span> <span class="content">Index</span></a>
     <ol class="toc">
      <li><a href="#index-defined-here"><span class="secno"></span> <span class="content">Terms defined by this specification</span></a>
      <li><a href="#index-defined-elsewhere"><span class="secno"></span> <span class="content">Terms defined by reference</span></a>
     </ol>
    <li>
     <a href="#references"><span class="secno"></span> <span class="content">References</span></a>
     <ol class="toc">
      <li><a href="#normative"><span class="secno"></span> <span class="content">Normative References</span></a>
      <li><a href="#informative"><span class="secno"></span> <span class="content">Informative References</span></a>
     </ol>
    <li><a href="#idl-index"><span class="secno"></span> <span class="content">IDL Index</span></a>
   </ol>
  </nav>
  <main>
   <h2 class="heading settled" data-level="1" id="intro"><span class="secno">1. </span><span class="content">Introduction</span><a class="self-link" href="#intro"></a></h2>
   <p>Sites and applications on the web are rarely composed of resources from
  only a single origin. For example, authors pull scripts and styles from a
  wide variety of services and content delivery networks, and must trust
  that the delivered representation is, in fact, what they expected to
  load. If an attacker can trick a user into downloading content from
  a hostile server (via DNS <a data-link-type="biblio" href="#biblio-rfc1035">[RFC1035]</a> poisoning, or other such means), the author has
  no recourse. Likewise, an attacker who can replace the file on the Content
  Delivery Network (CDN) server has the ability to inject arbitrary content.</p>
   <p>Delivering resources over a secure channel mitigates some of this risk: with
  TLS <a data-link-type="biblio" href="#biblio-tls">[TLS]</a>, HSTS <a data-link-type="biblio" href="#biblio-rfc6797">[RFC6797]</a>, and pinned public keys <a data-link-type="biblio" href="#biblio-rfc7469">[RFC7469]</a>, a user agent can be fairly certain
  that it is indeed speaking with the server it believes it’s talking to. These
  mechanisms, however, authenticate <em>only</em> the server, <em>not</em> the content. An
  attacker (or administrator) with access to the server can manipulate content with
  impunity. Ideally, authors would not only be able to pin the keys of a
  server, but also pin the <em>content</em>, ensuring that an exact representation of
  a resource, and <em>only</em> that representation, loads and executes.</p>
   <p>This document specifies such a validation scheme, extending two HTML elements
  with an <code>integrity</code> attribute that contains a cryptographic hash
  of the representation of the resource the author expects to load. For instance,
  an author may wish to load some framework from a shared server rather than hosting it
  on their own origin. Specifying that the <em>expected</em> SHA-384 hash of <code>https://example.com/example-framework.js</code> is <code>Li9vy3DqF8tnTXuiaAJuML3ky+er10rcgNR/VqsVpcw+ThHmYcwiB1pbOxEbzJr7</code> means
  that the user agent can verify that the data it loads from that URL matches
  that expected hash before executing the JavaScript it contains. This
  integrity verification significantly reduces the risk that an attacker can
  substitute malicious content.</p>
   <p>This example can be communicated to a user agent by adding the hash to a <code>script</code> element, like so:</p>
   <div class="example" id="example-59806504">
    <a class="self-link" href="#example-59806504"></a> 
<pre>&lt;script src="https://example.com/example-framework.js"
        integrity="sha384-Li9vy3DqF8tnTXuiaAJuML3ky+er10rcgNR/VqsVpcw+ThHmYcwiB1pbOxEbzJr7"
        crossorigin="anonymous">&lt;/script>
</pre>
   </div>
   <p>Scripts, of course, are not the only response type which would benefit
  from integrity validation. The scheme specified here also applies to <code>link</code> and future versions of this specification are likely to expand this coverage.</p>
   <h3 class="heading settled" data-level="1.1" id="goals"><span class="secno">1.1. </span><span class="content">Goals</span><a class="self-link" href="#goals"></a></h3>
   <ol>
    <li data-md>
     <p>Compromise of a third-party service should not automatically mean
  compromise of every site which includes its scripts. Content authors
  will have a mechanism by which they can specify expectations for
  content they load, meaning for example that they could load a <em>specific</em> script, and not <em>any</em> script that happens to have a
  particular URL.</p>
    <li data-md>
     <p>The verification mechanism should have error-reporting functionality which
  would inform the author that an invalid response was received.</p>
   </ol>
   <h3 class="heading settled" data-level="1.2" id="examples"><span class="secno">1.2. </span><span class="content">Use Cases/Examples</span><a class="self-link" href="#examples"></a></h3>
   <h4 class="heading settled" data-level="1.2.1" id="resource-integrity"><span class="secno">1.2.1. </span><span class="content">Resource Integrity</span><a class="self-link" href="#resource-integrity"></a></h4>
   <ul>
    <li data-md>
     <p>An author wishes to use a content delivery network to improve performance
  for globally-distributed users. It is important, however, to ensure that
  the CDN’s servers deliver <em>only</em> the code the author expects them to
  deliver. To mitigate the risk that a CDN compromise (or unexpectedly malicious
  behavior) would change that site in unfortunate ways, the following <a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata">integrity metadata</a> is added to the <code>link</code> element included on the page:</p>
     <div class="example" id="example-ed55c3e6">
      <a class="self-link" href="#example-ed55c3e6"></a> 
<pre>&lt;link rel="stylesheet" href="https://site53.example.net/style.css"
      integrity="sha384-+/M6kredJcxdsqkczBUjMLvqyHb1K/JThDXWsBVxMEeZHEaMKEOEct339VItX1zB"
      crossorigin="anonymous">
</pre>
     </div>
    <li data-md>
     <p>An author wants to include JavaScript provided by a third-party
  analytics service. To ensure that only the code that has been carefully
  reviewed is executed, the author generates <a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata①">integrity metadata</a> for
  the script, and adds it to the <code>script</code> element:</p>
     <div class="example" id="example-af0f59ce">
      <a class="self-link" href="#example-af0f59ce"></a> 
<pre>&lt;script src="https://analytics-r-us.example.com/v1.0/include.js"
        integrity="sha384-MBO5IDfYaE6c6Aao94oZrIOiC6CGiSN2n4QUbHNPhzk5Xhm0djZLQqTpL0HzTUxk"
        crossorigin="anonymous">&lt;/script>
</pre>
     </div>
    <li data-md>
     <p>A user agent wishes to ensure that JavaScript code running in high-privilege HTML
  contexts (for example, a browser’s New Tab page) aren’t manipulated before display. <a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata②">Integrity metadata</a> mitigates the risk that altered JavaScript will run
  in these pages' high-privilege contexts.</p>
   </ul>
   <h2 class="heading settled" data-level="2" id="terms"><span class="secno">2. </span><span class="content">Key Concepts and Terminology</span><a class="self-link" href="#terms"></a></h2>
   <p>This section defines several terms used throughout the document.</p>
   <p>The term <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="digest">digest</dfn> refers to the base64 encoded result of
  executing a cryptographic hash function on an arbitrary block of data.</p>
   <p>The terms <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin">origin</a> and <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#same-origin" id="ref-for-same-origin">same origin</a> are defined in HTML. <a data-link-type="biblio" href="#biblio-html">[HTML]</a></p>
   <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="representation-data">representation data</dfn> of a resource is defined by <a href="https://tools.ietf.org/html/rfc7231#section-3">Section 3
  of RFC 7231</a>. <a data-link-type="biblio" href="#biblio-rfc7231">[RFC7231]</a></p>
   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="base64-encoding">base64 encoding</dfn> is defined in <a href="https://tools.ietf.org/html/rfc4648#section-4">Section 4 of RFC 4648</a>. <a data-link-type="biblio" href="#biblio-rfc4648">[RFC4648]</a></p>
   <p>The <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-">SHA-256</a>, <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-①">SHA-384</a>, and <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-②">SHA-512</a> are part
  of the <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-③">SHA-2</a> set of cryptographic hash functions defined by the
  NIST. <a data-link-type="biblio" href="#biblio-sha2">[SHA2]</a></p>
   <h3 class="heading settled" data-level="2.1" id="grammar-concepts"><span class="secno">2.1. </span><span class="content">Grammatical Concepts</span><a class="self-link" href="#grammar-concepts"></a></h3>
   <p>The Augmented Backus-Naur Form (ABNF) notation used in this document is
  specified in RFC5234. <a data-link-type="biblio" href="#biblio-abnf">[ABNF]</a></p>
   <p><a href="https://tools.ietf.org/html/rfc5234#appendix-B.1" id="termref-for-④">Appendix B.1</a> of <a data-link-type="biblio" href="#biblio-abnf">[ABNF]</a> defines <a data-link-type="dfn" href="https://tools.ietf.org/html/rfc5234#appendix-B.1" id="ref-for-appendix-B.1">VCHAR</a> (printing characters).</p>
   <p><a data-link-type="dfn" href="https://tools.ietf.org/html/rfc5234#appendix-B.1" id="ref-for-appendix-B.1①">WSP</a> (white space) characters are defined in <a href="http://www.w3.org/TR/html5/infrastructure.html#space-character">Section 2.4.1 Common parser idioms</a> of the HTML 5 specification as <code>White_Space characters</code>. <a data-link-type="biblio" href="#biblio-html5">[HTML5]</a></p>
   <h2 class="heading settled" data-level="3" id="framework"><span class="secno">3. </span><span class="content">Framework</span><a class="self-link" href="#framework"></a></h2>
   <p>The integrity verification mechanism specified here boils down to the
  process of generating a sufficiently strong cryptographic digest for a
  resource, and transmitting that digest to a user agent so that it may be
  used to verify the response.</p>
   <h3 class="heading settled" data-level="3.1" id="integrity-metadata-description"><span class="secno">3.1. </span><span class="content">Integrity metadata</span><a class="self-link" href="#integrity-metadata-description"></a></h3>
   <p>To verify the integrity of a response, a user agent requires <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="integrity metadata" data-noexport id="integrity-metadata">integrity
  metadata</dfn> as part of the <a data-link-type="dfn" href="https://fetch.spec.whatwg.org#concept-request" id="ref-for-concept-request">request</a>. This metadata consists of the
  following pieces of information:</p>
   <ul>
    <li data-md>
     <p>cryptographic hash function ("alg")</p>
    <li data-md>
     <p><a data-link-type="dfn" href="#digest" id="ref-for-digest">digest</a> ("val")</p>
    <li data-md>
     <p>options ("opt")</p>
   </ul>
   <p>The hash function and digest MUST be provided in order to validate a
  response’s integrity.</p>
   <p class="note" role="note"><span>Note:</span> At the moment, no options are defined. However, future versions of
  the spec may define options, such as MIME types <a data-link-type="biblio" href="#biblio-mime-types">[MIME-TYPES]</a>.</p>
   <p>This metadata MUST be encoded in the same format as the <code>hash-source</code> (without
  the single quotes) in <a href="http://www.w3.org/TR/CSP2/#source-list-syntax">section 4.2 of the Content
  Security Policy Level 2 specification</a>.</p>
   <p>For example, given a script resource containing only the string <code>alert('Hello, world.');</code>, an author might choose <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-⑤">SHA-384</a> as a hash function. <code>H8BRh8j48O9oYatfu5AZzq6A9RINhZO5H16dQZngK7T62em8MUt1FLm52t+eX6xO</code> is the <a data-link-type="dfn" href="#base64-encoding" id="ref-for-base64-encoding">base64 encoded</a> digest that results. This can be encoded
  as follows:</p>
   <div class="example" id="example-cc8e7f02">
    <a class="self-link" href="#example-cc8e7f02"></a> 
<pre>sha384-H8BRh8j48O9oYatfu5AZzq6A9RINhZO5H16dQZngK7T62em8MUt1FLm52t+eX6xO
</pre>
   </div>
   <div class="note" role="note">
     Digests may be generated using any number of utilities. <a href="https://www.openssl.org/">OpenSSL</a>, for example, is quite commonly
  available. The example in this section is the result of the following command
  line: 
<pre>echo -n "alert('Hello, world.');" | openssl dgst -sha384 -binary | openssl base64 -A
</pre>
   </div>
   <h3 class="heading settled" data-level="3.2" id="hash-functions"><span class="secno">3.2. </span><span class="content">Cryptographic hash functions</span><a class="self-link" href="#hash-functions"></a></h3>
   <p>Conformant user agents MUST support the <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-⑥">SHA-256</a>, <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-⑦">SHA-384</a>,
  and <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-⑧">SHA-512</a> cryptographic hash functions for use as part of a
  request’s <a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata③">integrity metadata</a> and MAY support additional hash functions.</p>
   <p>User agents SHOULD refuse to support known-weak hashing functions like MD5 or
  SHA-1 and SHOULD restrict supported hashing functions to those known to be
  collision-resistant. Additionally, user agents SHOULD re-evaluate their
  supported hash functions on a regular basis and deprecate support for those
  functions that have become insecure. See <a href="#hash-collision-attacks">§ 5.2 Hash collision attacks</a>.</p>
   <h4 class="heading settled" data-level="3.2.1" id="agility"><span class="secno">3.2.1. </span><span class="content">Agility</span><a class="self-link" href="#agility"></a></h4>
   <p>Multiple sets of <a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata④">integrity metadata</a> may be associated with a single
  resource in order to provide agility in the face of future cryptographic discoveries.
  For example, the resource described in the previous section may be described
  by either of the following hash expressions:</p>
   <div class="example" id="example-a9403be4">
    <a class="self-link" href="#example-a9403be4"></a> 
<pre>sha384-H8BRh8j48O9oYatfu5AZzq6A9RINhZO5H16dQZngK7T62em8MUt1FLm52t+eX6xO
sha512-Q2bFTOhEALkN8hOms2FKTDLy7eugP2zFZ1T8LCvX42Fp3WoNr3bjZSAHeOsHrbV1Fu9/A0EzCinRE7Af1ofPrw==
</pre>
   </div>
   <p>Authors may choose to specify both, for example:</p>
   <div class="example" id="example-da4338e9">
    <a class="self-link" href="#example-da4338e9"></a> 
<pre>&lt;script src="hello_world.js"
   integrity="sha384-H8BRh8j48O9oYatfu5AZzq6A9RINhZO5H16dQZngK7T62em8MUt1FLm52t+eX6xO
              sha512-Q2bFTOhEALkN8hOms2FKTDLy7eugP2zFZ1T8LCvX42Fp3WoNr3bjZSAHeOsHrbV1Fu9/A0EzCinRE7Af1ofPrw=="
   crossorigin="anonymous">&lt;/script>
</pre>
   </div>
   <p>In this case, the user agent will choose the strongest hash function in the
  list, and use that metadata to validate the response (as described below in
  the <a href="#parse-metadata">§ 3.3.3 Parse metadata</a> and <a href="#get-the-strongest-metadata">§ 3.3.4 Get the strongest metadata from set</a> algorithms).</p>
   <p>When a hash function is determined to be insecure, user agents SHOULD deprecate
  and eventually remove support for integrity validation using the insecure hash
  function. User agents MAY check the validity of responses using a digest based on
  a deprecated function.</p>
   <p>To allow authors to switch to stronger hash functions without being held back by older
  user agents, validation using unsupported hash functions acts like no integrity value
  was provided (see the <a href="#does-response-match-metadatalist">§ 3.3.5 Does response match metadataList?</a> algorithm below).
  Authors  are encouraged to use strong hash functions, and to begin migrating to
  stronger hash functions as they become available.</p>
   <h4 class="heading settled" data-level="3.2.2" id="priority"><span class="secno">3.2.2. </span><span class="content">Priority</span><a class="self-link" href="#priority"></a></h4>
   <p>User agents must provide a mechanism for determining the relative priority of two
  hash functions and return the empty string if the priority is equal. That is, if
  a user agent implemented a function like <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="getprioritizedhashfunction">getPrioritizedHashFunction</dfn>(a,
  b) it would return the hash function the user agent considers the most
  collision-resistant.  For example, <code>getPrioritizedHashFunction('sha256', 'sha512')</code> would return <code>'sha512'</code> and <code>getPrioritizedHashFunction('sha256', 'sha256')</code> would return the empty string.</p>
   <p class="note" role="note"><span>Note:</span> The <a data-link-type="dfn" href="#getprioritizedhashfunction" id="ref-for-getprioritizedhashfunction">getPrioritizedHashFunction</a> is an internal
  implementation detail. It is not an API that implementors
  provide to web applications. It is used in this document
  only to simplify the algorithm description.</p>
   <h3 class="heading settled" data-level="3.3" id="verification-algorithms"><span class="secno">3.3. </span><span class="content">Response verification algorithms</span><a class="self-link" href="#verification-algorithms"></a></h3>
   <h4 class="heading settled" data-level="3.3.1" id="apply-algorithm-to-response"><span class="secno">3.3.1. </span><span class="content">Apply <var>algorithm</var> to <var>response</var></span><a class="self-link" href="#apply-algorithm-to-response"></a></h4>
   <ol>
    <li data-md>
     <p>Let <var>result</var> be the result of <a href="#apply-algorithm-to-response">§ 3.3.1 Apply algorithm to response</a> to the <a data-link-type="dfn" href="#representation-data" id="ref-for-representation-data">representation data</a> without any content-codings
  applied, except when the user agent intends to consume the content with
  content-encodings applied. In the latter case, let <var>result</var> be
  the result of applying <var>algorithm</var> to the <a data-link-type="dfn" href="#representation-data" id="ref-for-representation-data①">representation data</a>.</p>
    <li data-md>
     <p>Let <var>encodedResult</var> be result of <a data-link-type="dfn" href="#base64-encoding" id="ref-for-base64-encoding①">base64 encoding</a> <var>result</var>.</p>
    <li data-md>
     <p>Return <var>encodedResult</var>.</p>
   </ol>
   <h4 class="heading settled" data-level="3.3.2" id="is-response-eligible"><span class="secno">3.3.2. </span><span class="content">Is <var>response</var> eligible for integrity validation?</span><a class="self-link" href="#is-response-eligible"></a></h4>
   <p>In order to mitigate an attacker’s ability to read data cross-origin by
  brute-forcing values via integrity checks, responses are only eligible for such
  checks if they are same-origin or are the result of explicit access granted to
  the loading origin via Cross Origin Resource Sharing <a data-link-type="biblio" href="#biblio-cors">[CORS]</a>.</p>
   <p class="note" role="note"><span>Note:</span> As noted in <a href="https://tools.ietf.org/html/rfc6454#section-4">RFC6454, section 4</a>,
  some user agents use
  globally unique identifiers for each file URI. This means that
  resources accessed over a <code>file</code> scheme URL are unlikely to be
  eligible for integrity checks.</p>
   <p class="note" role="note"><span>Note:</span> Being in a <a data-link-type="dfn" href="&quot;http://www.w3.org/TR/powerful-features/&quot;#secure-context" id="ref-for-secure-context">Secure Context</a> (e.g., a document delivered over HTTPS) is not
  necessary for the use of integrity validation. Because resource integrity is
  only an application level security tool, and it does not change the security
  state of the user agent, a Secure Context is unnecessary. However, if integrity
  is used in something other than a Secure Context (e.g., a document delivered
  over HTTP), authors are reminded that the integrity provides <em>no security
  guarantees at all</em>. For this reason, authors are encouraged to only deliver
  integrity metadata in a Secure Context.  See <a href="#non-secure-contexts">§ 5.1 Non-secure contexts remain non-secure</a> for
  more discussion.</p>
   <p>The following algorithm details these restrictions:</p>
   <ol>
    <li data-md>
     <p>Let <var>response</var> be the response that results from <a data-link-type="dfn" href="https://fetch.spec.whatwg.org#concept-fetch" id="ref-for-concept-fetch">fetching</a> the <var>resource</var>.</p>
    <li data-md>
     <p>If the <a data-link-type="dfn" href="https://fetch.spec.whatwg.org#concept-response-type" id="ref-for-concept-response-type"><var>response</var> type</a> is <code>basic</code>, <code>cors</code> or <code>default</code>, return <code>true</code>.</p>
    <li data-md>
     <p>Return <code>false</code>.</p>
   </ol>
   <div class="note" role="note">
     The <a data-link-type="dfn" href="https://fetch.spec.whatwg.org#concept-response-type" id="ref-for-concept-response-type①">response types</a> are defined by the Fetch
  specification <a data-link-type="biblio" href="#biblio-fetch">[FETCH]</a> and refer to the following: 
    <ul>
     <li data-md>
      <p><code>basic</code> is a <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#same-origin" id="ref-for-same-origin①">same origin</a> response, and thus the requestor has full access
to read the body.</p>
     <li data-md>
      <p><code>cors</code> is a valid response to a cross-origin, CORS-enabled request, and thus
again the requestor has full access to read the body.</p>
     <li data-md>
      <p><code>default</code> is a valid response that is generated by a Service Worker as a
response to the request, so its body, too, is fully readable by the requestor.</p>
    </ul>
   </div>
   <h4 class="heading settled" data-level="3.3.3" id="parse-metadata"><span class="secno">3.3.3. </span><span class="content">Parse <var>metadata</var></span><a class="self-link" href="#parse-metadata"></a></h4>
   <p>This algorithm accepts a string, and returns either <code>no metadata</code>, or a set of
  valid hash expressions whose hash functions are understood by
  the user agent.</p>
   <ol>
    <li data-md>
     <p>Let <var>result</var> be the empty set.</p>
    <li data-md>
     <p>Let <var>empty</var> be equal to <code>true</code>.</p>
    <li data-md>
     <p>For each <var>token</var> returned by <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#strictly-split" id="ref-for-strictly-split">splitting <var>metadata</var> on
  spaces</a>:</p>
     <ol>
      <li data-md>
       <p>Set <var>empty</var> to <code>false</code>.</p>
      <li data-md>
       <p>Parse <var>token</var> as a <a data-link-type="grammar" href="#grammardef-hash-with-options" id="ref-for-grammardef-hash-with-options">hash-with-options</a>.</p>
      <li data-md>
       <p>If <var>token</var> does not parse, <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#iteration-continue" id="ref-for-iteration-continue">continue</a> to the next token.</p>
      <li data-md>
       <p>Let <var>algorithm</var> be the <a data-link-type="grammar" href="#grammardef-hash-algo" id="ref-for-grammardef-hash-algo">hash-algo</a> component of <var>token</var>.</p>
      <li data-md>
       <p>If <var>algorithm</var> is a hash function recognized by the user
  agent, add the parsed <var>token</var> to <var>result</var>.</p>
     </ol>
    <li data-md>
     <p>Return <code>no metadata</code> if <var>empty</var> is <code>true</code>, otherwise return <var>result</var>.</p>
   </ol>
   <h4 class="heading settled" data-level="3.3.4" id="get-the-strongest-metadata"><span class="secno">3.3.4. </span><span class="content">Get the strongest metadata from <var>set</var></span><a class="self-link" href="#get-the-strongest-metadata"></a></h4>
   <ol>
    <li data-md>
     <p>Let <var>result</var> be the empty set and <var>strongest</var> be the empty
  string.</p>
    <li data-md>
     <p>For each <var>item</var> in <var>set</var>:</p>
     <ol>
      <li data-md>
       <p>If <var>result</var> is the empty set, add <var>item</var> to <var>result</var> and set <var>strongest</var> to <var>item</var>, skip
  to the next <var>item</var>.</p>
      <li data-md>
       <p>Let <var>currentAlgorithm</var> be the <var>alg</var> component of <var>strongest</var>.</p>
      <li data-md>
       <p>Let <var>newAlgorithm</var> be the <var>alg</var> component of <var>item</var>.</p>
      <li data-md>
       <p>If the result of <a data-link-type="dfn" href="#getprioritizedhashfunction" id="ref-for-getprioritizedhashfunction①"> getPrioritizedHashFunction(<var>currentAlgorithm</var>, <var>newAlgorithm</var>)</a> is the empty string, add <var>item</var> to <var>result</var>. If the result is <var>newAlgorithm</var>, set <var>strongest</var> to <var>item</var>, set <var>result</var> to the empty
  set, and add <var>item</var> to <var>result</var>.</p>
     </ol>
    <li data-md>
     <p>Return <var>result</var>.</p>
   </ol>
   <h4 class="heading settled" data-level="3.3.5" id="does-response-match-metadatalist"><span class="secno">3.3.5. </span><span class="content">Does <var>response</var> match <var>metadataList</var>?</span><a class="self-link" href="#does-response-match-metadatalist"></a></h4>
   <ol>
    <li data-md>
     <p>Let <var>parsedMetadata</var> be the result of <a href="#parse-metadata">parsing <var>metadataList</var></a>.</p>
    <li data-md>
     <p>If <var>parsedMetadata</var> is <code>no metadata</code>, return <code>true</code>.</p>
    <li data-md>
     <p>If <a href="#is-response-eligible"><var>response</var> is not eligible for integrity
  validation</a>, return <code>false</code>.</p>
    <li data-md>
     <p>If <var>parsedMetadata</var> is the empty set, return <code>true</code>.</p>
    <li data-md>
     <p>Let <var>metadata</var> be the result of <a href="#get-the-strongest-metadata"> getting the strongest metadata from <var>parsedMetadata</var></a>.</p>
    <li data-md>
     <p>For each <var>item</var> in <var>metadata</var>:</p>
     <ol>
      <li data-md>
       <p>Let <var>algorithm</var> be the <var>alg</var> component of <var>item</var>.</p>
      <li data-md>
       <p>Let <var>expectedValue</var> be the <var>val</var> component of <var>item</var>.</p>
      <li data-md>
       <p>Let <var>actualValue</var> be the result of <a href="#apply-algorithm-to-response">applying <var>algorithm</var> to <var>response</var> </a>.</p>
      <li data-md>
       <p>If <var>actualValue</var> is a case-sensitive match for <var>expectedValue</var>, return <code>true</code>.</p>
     </ol>
    <li data-md>
     <p>Return <code>false</code>.</p>
   </ol>
   <p>This algorithm allows the user agent to accept multiple, valid strong hash
  functions. For example, a developer might write a <code>script</code> element such as:</p>
   <div class="example" id="example-3e451647">
    <a class="self-link" href="#example-3e451647"></a> 
<pre>&lt;script src="https://example.com/example-framework.js"
        integrity="sha384-Li9vy3DqF8tnTXuiaAJuML3ky+er10rcgNR/VqsVpcw+ThHmYcwiB1pbOxEbzJr7
                   sha384-+/M6kredJcxdsqkczBUjMLvqyHb1K/JThDXWsBVxMEeZHEaMKEOEct339VItX1zB"
        crossorigin="anonymous">&lt;/script>
</pre>
   </div>
   <p>which would allow the user agent to accept two different content payloads, one
  of which matches the first <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-⑨">SHA-384</a> hash value and the other matches the second <a data-link-type="dfn" href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#" id="termref-for-①⓪">SHA-384</a> hash value.</p>
   <p class="note" role="note"><span>Note:</span> User agents may allow users to modify the result of this algorithm via
  user preferences, bookmarklets, third-party additions to the user agent, and
  other such mechanisms. For example, redirects generated by an extension like <a href="https://www.eff.org/https-everywhere">HTTPS Everywhere</a> could load and
  execute correctly, even if the HTTPS version of a resource differs from the HTTP
  version.</p>
   <p class="note" role="note"><span>Note:</span> This algorithm returns <code>false</code> if the response is not <a href="#is-response-eligible">eligible</a> for integrity
  validation since Subresource Integrity requires CORS, and it is a logical error
  to attempt to use it without CORS. Additionally, user agents SHOULD report a
  warning message to the developer console to explain this failure.</p>
   <h3 class="heading settled" data-level="3.4" id="verification-of-html-document-subresources"><span class="secno">3.4. </span><span class="content">Verification of HTML document subresources</span><a class="self-link" href="#verification-of-html-document-subresources"></a></h3>
   <p>A variety of HTML elements result in requests for resources that are to be
  embedded into the document, or executed in its context. To support integrity
  metadata for some of these elements, a new <code>integrity</code> attribute is added to
  the list of content attributes for the <code>link</code> and <code>script</code> elements.</p>
   <p>A corresponding <code>integrity</code> IDL attribute which <a data-link-type="dfn" href="http://www.w3.org/TR/html5/infrastructure.html#reflect" id="ref-for-reflect">reflects</a> the
  value of each element’s <code>integrity</code> content attribute is added to the <code>HTMLLinkElement</code> and <code>HTMLScriptElement</code> interfaces.</p>
   <p class="note" role="note"><span>Note:</span> A future revision of this specification is likely to include integrity support
  for all possible subresources, i.e., <code>a</code>, <code>audio</code>, <code>embed</code>, <code>iframe</code>, <code>img</code>, <code>link</code>, <code>object</code>, <code>script</code>, <code>source</code>, <code>track</code>, and <code>video</code> elements.</p>
   <h3 class="heading settled" data-level="3.5" id="the-integrity-attribute"><span class="secno">3.5. </span><span class="content">The <code>integrity</code> attribute</span><a class="self-link" href="#the-integrity-attribute"></a></h3>
   <p>The <code>integrity</code> attribute represents <a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata⑤">integrity metadata</a> for an element.
  The value of the attribute MUST be either the empty string, or at least one
  valid metadata as described by the following ABNF grammar:</p>
<pre><dfn data-dfn-type="grammar" data-export id="grammardef-integrity-metadata">integrity-metadata<a class="self-link" href="#grammardef-integrity-metadata"></a></dfn> = *<a data-link-type="grammar" href="https://tools.ietf.org/html/rfc5234#appendix-B.1" id="ref-for-appendix-B.1②">WSP</a> <a data-link-type="grammar" href="#grammardef-hash-with-options" id="ref-for-grammardef-hash-with-options①">hash-with-options</a> *(1*<a data-link-type="grammar" href="https://tools.ietf.org/html/rfc5234#appendix-B.1" id="ref-for-appendix-B.1③">WSP</a> <a data-link-type="grammar" href="#grammardef-hash-with-options" id="ref-for-grammardef-hash-with-options②">hash-with-options</a> ) *<a data-link-type="grammar" href="https://tools.ietf.org/html/rfc5234#appendix-B.1" id="ref-for-appendix-B.1④">WSP</a> / *<a data-link-type="grammar" href="https://tools.ietf.org/html/rfc5234#appendix-B.1" id="ref-for-appendix-B.1⑤">WSP</a>
<dfn class="dfn-paneled" data-dfn-type="grammar" data-export id="grammardef-hash-with-options">hash-with-options</dfn>  = <a data-link-type="grammar" href="#grammardef-hash-expression" id="ref-for-grammardef-hash-expression">hash-expression</a> *("?" <a data-link-type="grammar" href="#grammardef-option-expression" id="ref-for-grammardef-option-expression">option-expression</a>)
<dfn class="dfn-paneled" data-dfn-type="grammar" data-export id="grammardef-option-expression">option-expression</dfn>  = *<a data-link-type="grammar" href="https://tools.ietf.org/html/rfc5234#appendix-B.1" id="ref-for-appendix-B.1⑥">VCHAR</a>
<dfn class="dfn-paneled" data-dfn-type="grammar" data-export id="grammardef-hash-algo">hash-algo</dfn>          = &lt;hash-algo production from [Content Security Policy Level 2, section 4.2]>
<dfn class="dfn-paneled" data-dfn-type="grammar" data-export id="grammardef-base64-value">base64-value</dfn>       = &lt;base64-value production from [Content Security Policy Level 2, section 4.2]>
<dfn class="dfn-paneled" data-dfn-type="grammar" data-export id="grammardef-hash-expression">hash-expression</dfn>    = <a data-link-type="grammar" href="#grammardef-hash-algo" id="ref-for-grammardef-hash-algo①">hash-algo</a> "-" <a data-link-type="grammar" href="#grammardef-base64-value" id="ref-for-grammardef-base64-value">base64-value</a>
</pre>
   <p>The <code>integrity</code> IDL attribute must <a data-link-type="dfn" href="http://www.w3.org/TR/html5/infrastructure.html#reflect" id="ref-for-reflect①">reflect</a> the <code>integrity</code> content attribute.</p>
   <p><code>option-expression</code>s are associated on a per <code>hash-expression</code> basis and are
  applied only to the <code>hash-expression</code> that immediately precedes it.</p>
   <p>In order for user agents to remain fully forwards compatible with future
  options, the user agent MUST ignore all unrecognized <code>option-expression</code>s.</p>
   <p class="note" role="note"><span>Note:</span> Note that while the <code>option-expression</code> has been reserved in the syntax,
  no options have been defined. It is likely that a future version of the spec
  will define a more specific syntax for options, so it is defined here as broadly
  as possible.</p>
   <h3 class="heading settled" data-level="3.6" id="interface-extensions"><span class="secno">3.6. </span><span class="content">Element interface extensions</span><a class="self-link" href="#interface-extensions"></a></h3>
   <h4 class="heading settled" data-level="3.6.1" id="HTMLLinkElement"><span class="secno">3.6.1. </span><span class="content">HTMLLinkElement</span><a class="self-link" href="#HTMLLinkElement"></a></h4>
<pre class="idl highlight def"><c- b>partial</c-> <c- b>interface</c-> <a class="idl-code" data-link-type="interface" href="https://html.spec.whatwg.org/multipage/semantics.html#htmllinkelement" id="ref-for-htmllinkelement"><c- g>HTMLLinkElement</c-></a> {
  <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString"><c- b>DOMString</c-></a> <dfn class="idl-code" data-dfn-for="HTMLLinkElement" data-dfn-type="attribute" data-export data-type="DOMString" id="dom-htmllinkelement-integrity"><code><c- g>integrity</c-></code><a class="self-link" href="#dom-htmllinkelement-integrity"></a></dfn>;
};
</pre>
   <h5 class="heading settled" data-level="3.6.1.1" id="HTMLLinkElement-Attributes"><span class="secno">3.6.1.1. </span><span class="content">Attributes</span><a class="self-link" href="#HTMLLinkElement-Attributes"></a></h5>
    <b>integrity</b> of type <code>DOMString</code>: The value of this element’s integrity
  attribute. 
   <h4 class="heading settled" data-level="3.6.2" id="HTMLScriptElement"><span class="secno">3.6.2. </span><span class="content">HTMLScriptElement</span><a class="self-link" href="#HTMLScriptElement"></a></h4>
<pre class="idl highlight def"><c- b>partial</c-> <c- b>interface</c-> <a class="idl-code" data-link-type="interface" href="https://html.spec.whatwg.org/multipage/scripting.html#htmlscriptelement" id="ref-for-htmlscriptelement"><c- g>HTMLScriptElement</c-></a> {
  <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString①"><c- b>DOMString</c-></a> <dfn class="idl-code" data-dfn-for="HTMLScriptElement" data-dfn-type="attribute" data-export data-type="DOMString" id="dom-htmlscriptelement-integrity"><code><c- g>integrity</c-></code><a class="self-link" href="#dom-htmlscriptelement-integrity"></a></dfn>;
};
</pre>
   <h5 class="heading settled" data-level="3.6.2.1" id="HTMLScriptElement-Attributes"><span class="secno">3.6.2.1. </span><span class="content">Attributes</span><a class="self-link" href="#HTMLScriptElement-Attributes"></a></h5>
    <b>integrity</b> of type <code>DOMString</code>: The value of this element’s integrity
  attribute. 
   <h3 class="heading settled" data-level="3.7" id="handling-integrity-violations"><span class="secno">3.7. </span><span class="content">Handling integrity violations</span><a class="self-link" href="#handling-integrity-violations"></a></h3>
   <p>The user agent will refuse to render or execute responses that fail an integrity
  check, instead returning a network error as defined in Fetch <a data-link-type="biblio" href="#biblio-fetch">[FETCH]</a>.</p>
   <p class="note" role="note"><span>Note:</span> On a failed integrity check, an <code>error</code> event is fired. Developers
  wishing to provide a canonical fallback resource (e.g., a resource not served
  from a CDN, perhaps from a secondary, trusted, but slower source) can catch this <code>error</code> event and provide an appropriate handler to replace the
  failed resource with a different one.</p>
   <h3 class="heading settled" data-level="3.8" id="elements"><span class="secno">3.8. </span><span class="content">Elements</span><a class="self-link" href="#elements"></a></h3>
   <h4 class="heading settled" data-level="3.8.1" id="link-element-for-stylesheets"><span class="secno">3.8.1. </span><span class="content">The <code>link</code> element for stylesheets</span><a class="self-link" href="#link-element-for-stylesheets"></a></h4>
   <p>Whenever a user agent attempts to <a data-link-type="dfn" href="http://www.w3.org/TR/html5/document-metadata.html#concept-link-obtain" id="ref-for-concept-link-obtain">obtain a resource</a> pointed to by a <code>link</code> element that has a <code>rel</code> attribute with the keyword of <code>stylesheet</code>,
  modify step 4 to read:</p>
   <p>Do a potentially CORS-enabled fetch of the resulting absolute URL, with the
  mode being the current state of the element’s crossorigin content attribute,
  the origin being the origin of the link element’s Document, the default origin
  behavior set to taint, and the <a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata⑥">integrity metadata</a> of the request set to
  the value of the element’s <code>integrity</code> attribute.</p>
   <h4 class="heading settled" data-level="3.8.2" id="script-element"><span class="secno">3.8.2. </span><span class="content">The <code>script</code> element</span><a class="self-link" href="#script-element"></a></h4>
   <p>Replace step 14.1 of HTML5’s <a data-link-type="dfn" href="http://www.w3.org/TR/html5/scripting-1.html#prepare-a-script" id="ref-for-prepare-a-script">prepare a script</a> algorithm with:</p>
   <ol>
    <li data-md>
     <p>Let <var>src</var> be the value of the element’s <code>src</code> attribute and
  the request’s associated <a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata⑦">integrity metadata</a> be the value of the
  element’s <code>integrity</code> attribute.</p>
   </ol>
   <h2 class="heading settled" data-level="4" id="proxies"><span class="secno">4. </span><span class="content">Proxies</span><a class="self-link" href="#proxies"></a></h2>
   <p>Optimizing proxies and other intermediate servers which modify the
  responses MUST ensure that the digest associated
  with those responses stays in sync with the new content. One option
  is to ensure that the <a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata⑧">integrity metadata</a> associated with
  resources is updated. Another
  would be simply to deliver only the canonical version of resources
  for which a page author has requested integrity verification.</p>
   <p>To help inform intermediate servers, those serving the resources SHOULD
  send along with the resource a <a data-link-type="dfn" href="https://tools.ietf.org/html/rfc7234#section-5.2" id="ref-for-section-5.2"><code>Cache-Control</code></a> header
  with a value of <a data-link-type="dfn" href="https://tools.ietf.org/html/rfc7234#section-5.2.1.6" id="ref-for-section-5.2.1.6"><code>no-transform</code></a>.</p>
   <h2 class="heading settled" data-level="5" id="security-considerations"><span class="secno">5. </span><span class="content">Security and Privacy Considerations</span><a class="self-link" href="#security-considerations"></a></h2>
   <p><em> This section is not normative.</em></p>
   <h3 class="heading settled" data-level="5.1" id="non-secure-contexts"><span class="secno">5.1. </span><span class="content">Non-secure contexts remain non-secure</span><a class="self-link" href="#non-secure-contexts"></a></h3>
   <p><a data-link-type="dfn" href="#integrity-metadata" id="ref-for-integrity-metadata⑨">Integrity metadata</a> delivered by a context that is not a <a data-link-type="dfn" href="&quot;http://www.w3.org/TR/powerful-features/&quot;#secure-context" id="ref-for-secure-context①">Secure
  Context</a> such as an HTTP page, only protects an origin against a compromise
  of the server where an external resources is hosted. Network attackers can alter
  the digest in-flight (or remove it entirely, or do absolutely anything else to
  the document), just as they could alter the response the hash is meant to
  validate.  Thus, it is recommended that authors deliver integrity metadata only
  to a <a data-link-type="dfn" href="&quot;http://www.w3.org/TR/powerful-features/&quot;#secure-context" id="ref-for-secure-context②">Secure Context</a>. See also <a href="http://www.w3.org/2001/tag/doc/web-https ">Securing the Web</a>.</p>
   <h3 class="heading settled" data-level="5.2" id="hash-collision-attacks"><span class="secno">5.2. </span><span class="content">Hash collision attacks</span><a class="self-link" href="#hash-collision-attacks"></a></h3>
   <p>Digests are only as strong as the hash function used to generate them. It is
  recommended that user agents refuse to support known-weak hashing functions and
  limit supported algorithms to those known to be collision resistant. Examples of
  hashing functions that are not recommended include MD5 and SHA-1. At the time of
  writing, SHA-384 is a good baseline.</p>
   <p>Moreover, it is recommended that user agents re-evaluate their supported hash
  functions on a regular basis and deprecate support for those functions shown to
  be insecure. Over time, hash functions may be shown to be much weaker than
  expected and, in some cases, broken, so it is important that user agents stay
  aware of these developments.</p>
   <h3 class="heading settled" data-level="5.3" id="cross-origin-data-leakage"><span class="secno">5.3. </span><span class="content">Cross-origin data leakage</span><a class="self-link" href="#cross-origin-data-leakage"></a></h3>
   <p>This specification requires the <a data-link-type="dfn" href="http://www.w3.org/TR/html5/infrastructure.html#cors-settings-attributes" id="ref-for-cors-settings-attributes">CORS settings attribute</a> to be present on
  integrity-protected cross-origin requests. If that requirement were omitted,
  attackers could violate the <a href="http://www.w3.org/Security/wiki/Same_Origin_Policy">same-origin policy</a> and determine whether a cross-origin resource has certain content.</p>
   <p>Attackers would attempt to load the resource with a known digest, and
  watch for load failures. If the load fails, the attacker could surmise
  that the response didn’t match the hash and thereby gain some insight into
  its contents. This might reveal, for example, whether or not a user is
  logged into a particular service.</p>
   <p>Moreover, attackers could brute-force specific values in an otherwise
  static resource. Consider a JSON response that looks like this:</p>
   <div class="example" id="example-2319c0a9">
    <a class="self-link" href="#example-2319c0a9"></a> 
<pre>{'status': 'authenticated', 'username': 'admin'}
</pre>
   </div>
   <p>An attacker could precompute hashes for the response with a variety of
  common usernames, and specify those hashes while repeatedly attempting
  to load the document. A successful load would confirm that the attacker
  has correctly guessed the username.</p>
   <h2 class="heading settled" data-level="6" id="acknowledgements"><span class="secno">6. </span><span class="content">Acknowledgements</span><a class="self-link" href="#acknowledgements"></a></h2>
   <p>Much of the content here is inspired heavily by Gervase Markham’s <a href="http://www.gerv.net/security/link-fingerprints/">Link Fingerprints</a> concept as well as WHATWG’s <a href="https://wiki.whatwg.org/wiki/Link_Hashes">Link Hashes</a>.</p>
   <p>A special thanks to Mike West for his invaluable contributions to the initial
  version of this spec. Thanks to Brad Hill, Anne van Kesteren, Jonathan
  Kingston, Mark Nottingham,  Sergey Shekyan , Dan Veditz, Eduardo Vela,
  Tanvi Vyas, and Michal Zalewski for providing invaluable feedback.</p>
  </main>
  <h2 class="no-ref no-num heading settled" id="conformance"><span class="content">Conformance</span><a class="self-link" href="#conformance"></a></h2>
  <h3 class="no-ref no-num heading settled" id="conventions"><span class="content">Document conventions</span><a class="self-link" href="#conventions"></a></h3>
  <p>Conformance requirements are expressed with a combination of
    descriptive assertions and RFC 2119 terminology. The key words “MUST”,
    “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”, “SHOULD NOT”,
    “RECOMMENDED”, “MAY”, and “OPTIONAL” in the normative parts of this
    document are to be interpreted as described in RFC 2119.
    However, for readability, these words do not appear in all uppercase
    letters in this specification. </p>
  <p>All of the text of this specification is normative except sections
    explicitly marked as non-normative, examples, and notes. <a data-link-type="biblio" href="#biblio-rfc2119">[RFC2119]</a></p>
  <p>Examples in this specification are introduced with the words “for example”
    or are set apart from the normative text with <code>class="example"</code>,
    like this: </p>
  <div class="example" id="example-ae2b6bc0">
   <a class="self-link" href="#example-ae2b6bc0"></a> 
   <p>This is an example of an informative example.</p>
  </div>
  <p>Informative notes begin with the word “Note” and are set apart from the
    normative text with <code>class="note"</code>, like this: </p>
  <p class="note" role="note">Note, this is an informative note.</p>
  <h3 class="no-ref no-num heading settled" id="conformant-algorithms"><span class="content">Conformant Algorithms</span><a class="self-link" href="#conformant-algorithms"></a></h3>
  <p>Requirements phrased in the imperative as part of algorithms (such as
    "strip any leading space characters" or "return false and abort these
    steps") are to be interpreted with the meaning of the key word ("must",
    "should", "may", etc) used in introducing the algorithm.</p>
  <p>Conformance requirements phrased as algorithms or specific steps can be
    implemented in any manner, so long as the end result is equivalent. In
    particular, the algorithms defined in this specification are intended to
    be easy to understand and are not intended to be performant. Implementers
    are encouraged to optimize.</p>
<script src="https://www.w3.org/scripts/TR/2016/fixup.js"></script>
  <h2 class="no-num no-ref heading settled" id="index"><span class="content">Index</span><a class="self-link" href="#index"></a></h2>
  <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="content">Terms defined by this specification</span><a class="self-link" href="#index-defined-here"></a></h3>
  <ul class="index">
   <li><a href="#base64-encoding">base64 encoding</a><span>, in §2</span>
   <li><a href="#grammardef-base64-value">base64-value</a><span>, in §3.5</span>
   <li><a href="#digest">digest</a><span>, in §2</span>
   <li><a href="#getprioritizedhashfunction">getPrioritizedHashFunction</a><span>, in §3.2.2</span>
   <li><a href="#grammardef-hash-algo">hash-algo</a><span>, in §3.5</span>
   <li><a href="#grammardef-hash-expression">hash-expression</a><span>, in §3.5</span>
   <li><a href="#grammardef-hash-with-options">hash-with-options</a><span>, in §3.5</span>
   <li>
    integrity
    <ul>
     <li><a href="#dom-htmllinkelement-integrity">attribute for HTMLLinkElement</a><span>, in §3.6.1</span>
     <li><a href="#dom-htmlscriptelement-integrity">attribute for HTMLScriptElement</a><span>, in §3.6.2</span>
    </ul>
   <li><a href="#grammardef-integrity-metadata">integrity-metadata</a><span>, in §3.5</span>
   <li><a href="#integrity-metadata">integrity metadata</a><span>, in §3.1</span>
   <li><a href="#grammardef-option-expression">option-expression</a><span>, in §3.5</span>
   <li><a href="#representation-data">representation data</a><span>, in §2</span>
  </ul>
  <aside class="dfn-panel" data-for="term-for-appendix-B.1">
   <a href="https://tools.ietf.org/html/rfc5234#appendix-B.1">https://tools.ietf.org/html/rfc5234#appendix-B.1</a><b>Referenced in:</b>
   <ul>
    <li><a href="#termref-for-">2.1. Grammatical Concepts</a> <a href="#ref-for-appendix-B.1">(2)</a> <a href="#ref-for-appendix-B.1①">(3)</a>
    <li><a href="#ref-for-appendix-B.1②">3.5. The integrity attribute</a> <a href="#ref-for-appendix-B.1③">(2)</a> <a href="#ref-for-appendix-B.1④">(3)</a> <a href="#ref-for-appendix-B.1⑤">(4)</a> <a href="#ref-for-appendix-B.1⑥">(5)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-appendix-B.1">
   <a href="https://tools.ietf.org/html/rfc5234#appendix-B.1">https://tools.ietf.org/html/rfc5234#appendix-B.1</a><b>Referenced in:</b>
   <ul>
    <li><a href="#termref-for-">2.1. Grammatical Concepts</a> <a href="#ref-for-appendix-B.1">(2)</a> <a href="#ref-for-appendix-B.1①">(3)</a>
    <li><a href="#ref-for-appendix-B.1②">3.5. The integrity attribute</a> <a href="#ref-for-appendix-B.1③">(2)</a> <a href="#ref-for-appendix-B.1④">(3)</a> <a href="#ref-for-appendix-B.1⑤">(4)</a> <a href="#ref-for-appendix-B.1⑥">(5)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-concept-fetch">
   <a href="https://fetch.spec.whatwg.org#concept-fetch">https://fetch.spec.whatwg.org#concept-fetch</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-concept-fetch">3.3.2. Is response eligible for integrity validation?</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-concept-request">
   <a href="https://fetch.spec.whatwg.org#concept-request">https://fetch.spec.whatwg.org#concept-request</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-concept-request">3.1. Integrity metadata</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-concept-response-type">
   <a href="https://fetch.spec.whatwg.org#concept-response-type">https://fetch.spec.whatwg.org#concept-response-type</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-concept-response-type">3.3.2. Is response eligible for integrity validation?</a> <a href="#ref-for-concept-response-type①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-htmllinkelement">
   <a href="https://html.spec.whatwg.org/multipage/semantics.html#htmllinkelement">https://html.spec.whatwg.org/multipage/semantics.html#htmllinkelement</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-htmllinkelement">3.6.1. HTMLLinkElement</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-htmlscriptelement">
   <a href="https://html.spec.whatwg.org/multipage/scripting.html#htmlscriptelement">https://html.spec.whatwg.org/multipage/scripting.html#htmlscriptelement</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-htmlscriptelement">3.6.2. HTMLScriptElement</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-concept-origin">
   <a href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin">https://html.spec.whatwg.org/multipage/origin.html#concept-origin</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-concept-origin">2. Key Concepts and Terminology</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-same-origin">
   <a href="https://html.spec.whatwg.org/multipage/origin.html#same-origin">https://html.spec.whatwg.org/multipage/origin.html#same-origin</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-same-origin">2. Key Concepts and Terminology</a>
    <li><a href="#ref-for-same-origin①">3.3.2. Is response eligible for integrity validation?</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-cors-settings-attributes">
   <a href="http://www.w3.org/TR/html5/infrastructure.html#cors-settings-attributes">http://www.w3.org/TR/html5/infrastructure.html#cors-settings-attributes</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-cors-settings-attributes">5.3. Cross-origin data leakage</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-concept-link-obtain">
   <a href="http://www.w3.org/TR/html5/document-metadata.html#concept-link-obtain">http://www.w3.org/TR/html5/document-metadata.html#concept-link-obtain</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-concept-link-obtain">3.8.1. The link element for stylesheets</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-prepare-a-script">
   <a href="http://www.w3.org/TR/html5/scripting-1.html#prepare-a-script">http://www.w3.org/TR/html5/scripting-1.html#prepare-a-script</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-prepare-a-script">3.8.2. The script element</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-reflect">
   <a href="http://www.w3.org/TR/html5/infrastructure.html#reflect">http://www.w3.org/TR/html5/infrastructure.html#reflect</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-reflect">3.4. Verification of HTML document subresources</a>
    <li><a href="#ref-for-reflect①">3.5. The integrity attribute</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-iteration-continue">
   <a href="https://infra.spec.whatwg.org/#iteration-continue">https://infra.spec.whatwg.org/#iteration-continue</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-iteration-continue">3.3.3. Parse metadata</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-strictly-split">
   <a href="https://infra.spec.whatwg.org/#strictly-split">https://infra.spec.whatwg.org/#strictly-split</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-strictly-split">3.3.3. Parse metadata</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-section-5.2">
   <a href="https://tools.ietf.org/html/rfc7234#section-5.2">https://tools.ietf.org/html/rfc7234#section-5.2</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-section-5.2">4. Proxies</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-section-5.2.1.6">
   <a href="https://tools.ietf.org/html/rfc7234#section-5.2.1.6">https://tools.ietf.org/html/rfc7234#section-5.2.1.6</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-section-5.2.1.6">4. Proxies</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-secure-context">
   <a href="&quot;http://www.w3.org/TR/powerful-features/&quot;#secure-context">"http://www.w3.org/TR/powerful-features/"#secure-context</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-secure-context">3.3.2. Is response eligible for integrity validation?</a>
    <li><a href="#ref-for-secure-context①">5.1. Non-secure contexts remain non-secure</a> <a href="#ref-for-secure-context②">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-">
   <a href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#">http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#</a><b>Referenced in:</b>
   <ul>
    <li><a href="#termref-for-">2. Key Concepts and Terminology</a> <a href="#termref-for-">(2)</a> <a href="#termref-for-">(3)</a> <a href="#termref-for-">(4)</a>
    <li><a href="#termref-for-">3.1. Integrity metadata</a>
    <li><a href="#termref-for-">3.2. Cryptographic hash functions</a> <a href="#termref-for-">(2)</a> <a href="#termref-for-">(3)</a>
    <li><a href="#termref-for-">3.3.5. Does response match metadataList?</a> <a href="#termref-for-">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-">
   <a href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#">http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#</a><b>Referenced in:</b>
   <ul>
    <li><a href="#termref-for-">2. Key Concepts and Terminology</a> <a href="#termref-for-">(2)</a> <a href="#termref-for-">(3)</a> <a href="#termref-for-">(4)</a>
    <li><a href="#termref-for-">3.1. Integrity metadata</a>
    <li><a href="#termref-for-">3.2. Cryptographic hash functions</a> <a href="#termref-for-">(2)</a> <a href="#termref-for-">(3)</a>
    <li><a href="#termref-for-">3.3.5. Does response match metadataList?</a> <a href="#termref-for-">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-">
   <a href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#">http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#</a><b>Referenced in:</b>
   <ul>
    <li><a href="#termref-for-">2. Key Concepts and Terminology</a> <a href="#termref-for-">(2)</a> <a href="#termref-for-">(3)</a> <a href="#termref-for-">(4)</a>
    <li><a href="#termref-for-">3.1. Integrity metadata</a>
    <li><a href="#termref-for-">3.2. Cryptographic hash functions</a> <a href="#termref-for-">(2)</a> <a href="#termref-for-">(3)</a>
    <li><a href="#termref-for-">3.3.5. Does response match metadataList?</a> <a href="#termref-for-">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-">
   <a href="http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#">http://csrc.nist.gov/publications/fips/fips180-4/fips-180-4.pdf#</a><b>Referenced in:</b>
   <ul>
    <li><a href="#termref-for-">2. Key Concepts and Terminology</a> <a href="#termref-for-">(2)</a> <a href="#termref-for-">(3)</a> <a href="#termref-for-">(4)</a>
    <li><a href="#termref-for-">3.1. Integrity metadata</a>
    <li><a href="#termref-for-">3.2. Cryptographic hash functions</a> <a href="#termref-for-">(2)</a> <a href="#termref-for-">(3)</a>
    <li><a href="#termref-for-">3.3.5. Does response match metadataList?</a> <a href="#termref-for-">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-idl-DOMString">
   <a href="https://heycam.github.io/webidl/#idl-DOMString">https://heycam.github.io/webidl/#idl-DOMString</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-idl-DOMString">3.6.1. HTMLLinkElement</a>
    <li><a href="#ref-for-idl-DOMString①">3.6.2. HTMLScriptElement</a>
   </ul>
  </aside>
  <h3 class="no-num no-ref heading settled" id="index-defined-elsewhere"><span class="content">Terms defined by reference</span><a class="self-link" href="#index-defined-elsewhere"></a></h3>
  <ul class="index">
   <li>
    <a data-link-type="biblio">[ABNF]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-appendix-B.1" style="color:initial">vchar</span>
     <li><span class="dfn-paneled" id="term-for-appendix-B.1①" style="color:initial">wsp</span>
    </ul>
   <li>
    <a data-link-type="biblio">[FETCH]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-concept-fetch" style="color:initial">fetch</span>
     <li><span class="dfn-paneled" id="term-for-concept-request" style="color:initial">request</span>
     <li><span class="dfn-paneled" id="term-for-concept-response-type" style="color:initial">response type</span>
    </ul>
   <li>
    <a data-link-type="biblio">[HTML]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-htmllinkelement" style="color:initial">HTMLLinkElement</span>
     <li><span class="dfn-paneled" id="term-for-htmlscriptelement" style="color:initial">HTMLScriptElement</span>
     <li><span class="dfn-paneled" id="term-for-concept-origin" style="color:initial">origin</span>
     <li><span class="dfn-paneled" id="term-for-same-origin" style="color:initial">same origin</span>
    </ul>
   <li>
    <a data-link-type="biblio">[HTML5]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-cors-settings-attributes" style="color:initial">cors settings attribute</span>
     <li><span class="dfn-paneled" id="term-for-concept-link-obtain" style="color:initial">obtain a resource</span>
     <li><span class="dfn-paneled" id="term-for-prepare-a-script" style="color:initial">prepare a script</span>
     <li><span class="dfn-paneled" id="term-for-reflect" style="color:initial">reflect</span>
    </ul>
   <li>
    <a data-link-type="biblio">[INFRA]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-iteration-continue" style="color:initial">continue</span>
     <li><span class="dfn-paneled" id="term-for-strictly-split" style="color:initial">strictly split</span>
    </ul>
   <li>
    <a data-link-type="biblio">[rfc7234]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-section-5.2" style="color:initial">cache-control</span>
     <li><span class="dfn-paneled" id="term-for-section-5.2.1.6" style="color:initial">no-transform</span>
    </ul>
   <li>
    <a data-link-type="biblio">[SECURE-CONTEXTS]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-secure-context" style="color:initial">secure context</span>
    </ul>
   <li>
    <a data-link-type="biblio">[SHA2]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-" style="color:initial">sha-2</span>
     <li><span class="dfn-paneled" id="term-for-①" style="color:initial">sha-256</span>
     <li><span class="dfn-paneled" id="term-for-②" style="color:initial">sha-384</span>
     <li><span class="dfn-paneled" id="term-for-③" style="color:initial">sha-512</span>
    </ul>
   <li>
    <a data-link-type="biblio">[WebIDL]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-idl-DOMString" style="color:initial">DOMString</span>
    </ul>
  </ul>
  <h2 class="no-num no-ref heading settled" id="references"><span class="content">References</span><a class="self-link" href="#references"></a></h2>
  <h3 class="no-num no-ref heading settled" id="normative"><span class="content">Normative References</span><a class="self-link" href="#normative"></a></h3>
  <dl>
   <dt id="biblio-abnf">[ABNF]
   <dd>D. Crocker, Ed.; P. Overell. <a href="https://tools.ietf.org/html/rfc5234">Augmented BNF for Syntax Specifications: ABNF</a>. January 2008. Internet Standard. URL: <a href="https://tools.ietf.org/html/rfc5234">https://tools.ietf.org/html/rfc5234</a>
   <dt id="biblio-cors">[CORS]
   <dd>Anne van Kesteren. <a href="https://www.w3.org/TR/cors/">Cross-Origin Resource Sharing</a>. 16 January 2014. REC. URL: <a href="https://www.w3.org/TR/cors/">https://www.w3.org/TR/cors/</a>
   <dt id="biblio-fetch">[FETCH]
   <dd>Anne van Kesteren. <a href="https://fetch.spec.whatwg.org/">Fetch Standard</a>. Living Standard. URL: <a href="https://fetch.spec.whatwg.org/">https://fetch.spec.whatwg.org/</a>
   <dt id="biblio-html">[HTML]
   <dd>Anne van Kesteren; et al. <a href="https://html.spec.whatwg.org/multipage/">HTML Standard</a>. Living Standard. URL: <a href="https://html.spec.whatwg.org/multipage/">https://html.spec.whatwg.org/multipage/</a>
   <dt id="biblio-html5">[HTML5]
   <dd>Ian Hickson; et al. <a href="https://www.w3.org/TR/html5/">HTML5</a>. 27 March 2018. REC. URL: <a href="https://www.w3.org/TR/html5/">https://www.w3.org/TR/html5/</a>
   <dt id="biblio-infra">[INFRA]
   <dd>Anne van Kesteren; Domenic Denicola. <a href="https://infra.spec.whatwg.org/">Infra Standard</a>. Living Standard. URL: <a href="https://infra.spec.whatwg.org/">https://infra.spec.whatwg.org/</a>
   <dt id="biblio-mime-types">[MIME-TYPES]
   <dd>N. Freed; N. Borenstein. <a href="https://tools.ietf.org/html/rfc2046">Multipurpose Internet Mail Extensions (MIME) Part Two: Media Types</a>. November 1996. Draft Standard. URL: <a href="https://tools.ietf.org/html/rfc2046">https://tools.ietf.org/html/rfc2046</a>
   <dt id="biblio-rfc2119">[RFC2119]
   <dd>S. Bradner. <a href="https://tools.ietf.org/html/rfc2119">Key words for use in RFCs to Indicate Requirement Levels</a>. March 1997. Best Current Practice. URL: <a href="https://tools.ietf.org/html/rfc2119">https://tools.ietf.org/html/rfc2119</a>
   <dt id="biblio-rfc4648">[RFC4648]
   <dd>S. Josefsson. <a href="https://tools.ietf.org/html/rfc4648">The Base16, Base32, and Base64 Data Encodings</a>. October 2006. Proposed Standard. URL: <a href="https://tools.ietf.org/html/rfc4648">https://tools.ietf.org/html/rfc4648</a>
   <dt id="biblio-rfc7231">[RFC7231]
   <dd>R. Fielding, Ed.; J. Reschke, Ed.. <a href="https://httpwg.org/specs/rfc7231.html">Hypertext Transfer Protocol (HTTP/1.1): Semantics and Content</a>. June 2014. Proposed Standard. URL: <a href="https://httpwg.org/specs/rfc7231.html">https://httpwg.org/specs/rfc7231.html</a>
   <dt id="biblio-rfc7234">[RFC7234]
   <dd>R. Fielding, Ed.; M. Nottingham, Ed.; J. Reschke, Ed.. <a href="https://httpwg.org/specs/rfc7234.html">Hypertext Transfer Protocol (HTTP/1.1): Caching</a>. June 2014. Proposed Standard. URL: <a href="https://httpwg.org/specs/rfc7234.html">https://httpwg.org/specs/rfc7234.html</a>
   <dt id="biblio-secure-contexts">[SECURE-CONTEXTS]
   <dd>Mike West; Yan Zhu. <a href="https://w3c.github.io/webappsec-secure-contexts/">Secure Contexts</a>. WD. URL: <a href="https://w3c.github.io/webappsec-secure-contexts/">https://w3c.github.io/webappsec-secure-contexts/</a>
   <dt id="biblio-sha2">[SHA2]
   <dd><a href="http://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">FIPS PUB 180-4, Secure Hash Standard</a>. URL: <a href="http://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">http://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf</a>
   <dt id="biblio-webidl">[WebIDL]
   <dd>Boris Zbarsky. <a href="https://heycam.github.io/webidl/">Web IDL</a>. 15 December 2016. ED. URL: <a href="https://heycam.github.io/webidl/">https://heycam.github.io/webidl/</a>
  </dl>
  <h3 class="no-num no-ref heading settled" id="informative"><span class="content">Informative References</span><a class="self-link" href="#informative"></a></h3>
  <dl>
   <dt id="biblio-rfc1035">[RFC1035]
   <dd>P.V. Mockapetris. <a href="https://tools.ietf.org/html/rfc1035">Domain names - implementation and specification</a>. November 1987. Internet Standard. URL: <a href="https://tools.ietf.org/html/rfc1035">https://tools.ietf.org/html/rfc1035</a>
   <dt id="biblio-rfc6797">[RFC6797]
   <dd>J. Hodges; C. Jackson; A. Barth. <a href="https://tools.ietf.org/html/rfc6797">HTTP Strict Transport Security (HSTS)</a>. November 2012. Proposed Standard. URL: <a href="https://tools.ietf.org/html/rfc6797">https://tools.ietf.org/html/rfc6797</a>
   <dt id="biblio-rfc7469">[RFC7469]
   <dd>C. Evans; C. Palmer; R. Sleevi. <a href="https://tools.ietf.org/html/rfc7469">Public Key Pinning Extension for HTTP</a>. April 2015. Proposed Standard. URL: <a href="https://tools.ietf.org/html/rfc7469">https://tools.ietf.org/html/rfc7469</a>
   <dt id="biblio-tls">[TLS]
   <dd>E. Rescorla. <a href="https://tools.ietf.org/html/rfc8446">The Transport Layer Security (TLS) Protocol Version 1.3</a>. August 2018. Proposed Standard. URL: <a href="https://tools.ietf.org/html/rfc8446">https://tools.ietf.org/html/rfc8446</a>
  </dl>
  <h2 class="no-num no-ref heading settled" id="idl-index"><span class="content">IDL Index</span><a class="self-link" href="#idl-index"></a></h2>
<pre class="idl highlight def"><c- b>partial</c-> <c- b>interface</c-> <a class="idl-code" data-link-type="interface" href="https://html.spec.whatwg.org/multipage/semantics.html#htmllinkelement" id="ref-for-htmllinkelement①"><c- g>HTMLLinkElement</c-></a> {
  <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString②"><c- b>DOMString</c-></a> <a data-type="DOMString" href="#dom-htmllinkelement-integrity"><code><c- g>integrity</c-></code></a>;
};

<c- b>partial</c-> <c- b>interface</c-> <a class="idl-code" data-link-type="interface" href="https://html.spec.whatwg.org/multipage/scripting.html#htmlscriptelement" id="ref-for-htmlscriptelement①"><c- g>HTMLScriptElement</c-></a> {
  <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString①①"><c- b>DOMString</c-></a> <a data-type="DOMString" href="#dom-htmlscriptelement-integrity"><code><c- g>integrity</c-></code></a>;
};

</pre>
  <aside class="dfn-panel" data-for="digest">
   <b><a href="#digest">#digest</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-digest">3.1. Integrity metadata</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="representation-data">
   <b><a href="#representation-data">#representation-data</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-representation-data">3.3.1. Apply algorithm to response</a> <a href="#ref-for-representation-data①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="base64-encoding">
   <b><a href="#base64-encoding">#base64-encoding</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-base64-encoding">3.1. Integrity metadata</a>
    <li><a href="#ref-for-base64-encoding①">3.3.1. Apply algorithm to response</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="integrity-metadata">
   <b><a href="#integrity-metadata">#integrity-metadata</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-integrity-metadata">1.2.1. Resource Integrity</a> <a href="#ref-for-integrity-metadata①">(2)</a> <a href="#ref-for-integrity-metadata②">(3)</a>
    <li><a href="#ref-for-integrity-metadata③">3.2. Cryptographic hash functions</a>
    <li><a href="#ref-for-integrity-metadata④">3.2.1. Agility</a>
    <li><a href="#ref-for-integrity-metadata⑤">3.5. The integrity attribute</a>
    <li><a href="#ref-for-integrity-metadata⑥">3.8.1. The link element for stylesheets</a>
    <li><a href="#ref-for-integrity-metadata⑦">3.8.2. The script element</a>
    <li><a href="#ref-for-integrity-metadata⑧">4. Proxies</a>
    <li><a href="#ref-for-integrity-metadata⑨">5.1. Non-secure contexts remain non-secure</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="getprioritizedhashfunction">
   <b><a href="#getprioritizedhashfunction">#getprioritizedhashfunction</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-getprioritizedhashfunction">3.2.2. Priority</a>
    <li><a href="#ref-for-getprioritizedhashfunction①">3.3.4. Get the strongest metadata from set</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="grammardef-hash-with-options">
   <b><a href="#grammardef-hash-with-options">#grammardef-hash-with-options</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-grammardef-hash-with-options">3.3.3. Parse metadata</a>
    <li><a href="#ref-for-grammardef-hash-with-options①">3.5. The integrity attribute</a> <a href="#ref-for-grammardef-hash-with-options②">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="grammardef-option-expression">
   <b><a href="#grammardef-option-expression">#grammardef-option-expression</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-grammardef-option-expression">3.5. The integrity attribute</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="grammardef-hash-algo">
   <b><a href="#grammardef-hash-algo">#grammardef-hash-algo</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-grammardef-hash-algo">3.3.3. Parse metadata</a>
    <li><a href="#ref-for-grammardef-hash-algo①">3.5. The integrity attribute</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="grammardef-base64-value">
   <b><a href="#grammardef-base64-value">#grammardef-base64-value</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-grammardef-base64-value">3.5. The integrity attribute</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="grammardef-hash-expression">
   <b><a href="#grammardef-hash-expression">#grammardef-hash-expression</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-grammardef-hash-expression">3.5. The integrity attribute</a>
   </ul>
  </aside>
<script>/* script-dfn-panel */

document.body.addEventListener("click", function(e) {
    var queryAll = function(sel) { return [].slice.call(document.querySelectorAll(sel)); }
    // Find the dfn element or panel, if any, that was clicked on.
    var el = e.target;
    var target;
    var hitALink = false;
    while(el.parentElement) {
        if(el.tagName == "A") {
            // Clicking on a link in a <dfn> shouldn't summon the panel
            hitALink = true;
        }
        if(el.classList.contains("dfn-paneled")) {
            target = "dfn";
            break;
        }
        if(el.classList.contains("dfn-panel")) {
            target = "dfn-panel";
            break;
        }
        el = el.parentElement;
    }
    if(target != "dfn-panel") {
        // Turn off any currently "on" or "activated" panels.
        queryAll(".dfn-panel.on, .dfn-panel.activated").forEach(function(el){
            el.classList.remove("on");
            el.classList.remove("activated");
        });
    }
    if(target == "dfn" && !hitALink) {
        // open the panel
        var dfnPanel = document.querySelector(".dfn-panel[data-for='" + el.id + "']");
        if(dfnPanel) {
            dfnPanel.classList.add("on");
            var rect = el.getBoundingClientRect();
            dfnPanel.style.left = window.scrollX + rect.right + 5 + "px";
            dfnPanel.style.top = window.scrollY + rect.top + "px";
            var panelRect = dfnPanel.getBoundingClientRect();
            var panelWidth = panelRect.right - panelRect.left;
            if(panelRect.right > document.body.scrollWidth && (rect.left - (panelWidth + 5)) > 0) {
                // Reposition, because the panel is overflowing
                dfnPanel.style.left = window.scrollX + rect.left - (panelWidth + 5) + "px";
            }
        } else {
            console.log("Couldn't find .dfn-panel[data-for='" + el.id + "']");
        }
    } else if(target == "dfn-panel") {
        // Switch it to "activated" state, which pins it.
        el.classList.add("activated");
        el.style.left = null;
        el.style.top = null;
    }

});
</script>